Helping UK Students Get the Gig

University students have packed and unpredictable schedules. To accomodate their need for flexible and portable work, Unigigster offers microtasks so students can get paid on the go.

Unigigser is a UK-based startup [give the stat about beig in that one magazine for promising startups. was linked on LinkedIn] that provides short-term, flexible "gigs" that students can work at their own pace, in exchange for pay.

The problem

Timeline: September-November, 2022 Team Members: Myself, Alec [last name, and link to him here.] My Role: heuristic evaluation, research on Material's design standards (?), discovering and understanding the specifics of our clients' technical restraints, rearchitechting the app, Restraints: cost, development, etc. They were using React and were familiar with Material.io. By following Google's Material.io design recommendations, we were able to deliver a design that was cost-effective to code, as the engineers could implement the designs quickly due to there being a Material Design component library for React. User goals: find gigs as quickly and easily as possible. Business goals: find out what it throttling their user conversion from signup -> completion of the registration process. Before my team got involved, [X number of] users were signing up for Unigigster (ie creating an account with a username and password), but only (percentage) were taking the additional steps required to complete registration and begin working on gigs. Those extra steps involve: uploading a current photo ID, signing into your university home page for verification, and providing personal details including bank acount information. But new users consistently weren't completing the additional steps that would qualify them to accept "gigs," and access the full functionallity of the platform. Or to put it another way, users came, users saw...and then users gave up, instead of taking the next steps on their journey to become gigsters. OUR Q: How might we streamline the registration flow to increase user conversion rates? Q: How might we increase the number of students who complete the entire registration flow, including providing proof of enrollment and bank account details? Hypothesis: By conduction a heuristic audit of the interface, we can use time-tested design wisdom to iron out potenial usability issues, thus leading to higher conversion rates. The design process: We did a heuristic evaluation of the application, and quickly identified three main areas that commonly cause friction for users (thus hindering conversion.) 1. Navigation 2. Clarity of instructions 3. Too many steps to take to get signed up, and the process wasn't explained or outlined ahead of time. Let's take these one at a time. Navigation: how might we align the navigation patterns with common patterns so that users can rely on recognition, rather than recall? A: Google's Material Design standard are ubiquitous on today's internet. If you've ever used gmail [list products maybe?] [Quote about what percentage of sites use Material's design standards.] Jakob's rule tells us that users will spend the vast majority on other sites. Therefor, for the best user experience, we should rely on known UI patterns whenever possible. --- article maybe? h2 Old nav (show picture) Issues we identified: - Couldn't see all nav issues at once. - Too many different types of things all lumped under nav. Confusing for users. [BOLD THIS] No clear pathway through the app that guides users to complete the signup project before they can start working on tasks. Instead, the requirement to complete student verification is an invisible barrier that users don't see until they run right into it - right as they try to accept their first gig. How we addressed these usuability challenges: - Show how the side bar complied with Material Design's standards at the time. Perhaps give a reason or two as to why side navitation increases usability, or is the recommended industry standard. - One note is that this project was completed in fall of 2021, before the release of Material 3.0. If I were to redesign it today, I would of course use the updated standards. - Still, Material 2.0's recommendations remain widely used and were carefully researched to include accessibility, so this is still a solid and usable design. --- ISSUE #2: Users did not have a clear idea how they should complete the "student verification" registration flow. We addressed this by: - Reducing the number of steps - and duplicate activities - that users would need to do to sign up - We grouped related tasks together into a single "step," thus reducing the mental load of the users. - We also let users know up front a) what documentation they would need to provide and b) an overview of what those steps were With a user path more clearly outlined and streamlined, user conversation raised from [X percent] to [Y percent.] That means an additional [Z number] of users were able to sign up and complete tasks in 2022. TO ENDISH: show a bunch of side by sides, complete with annotations on the decisions that were made -- also, i could potentially do like a gif that fades out to show the designs one on top of the other Takeaways and next steps (eh, might not use idk) - Understanding and designing for the current tech stack (ie code language and libraries in use) is a key part of designing for tight-knit teams - It's crucial [END] TODO: get some stats about shortened developer time, or any other dev experiences that were improved/stream lined/shortened because of our design. TODO: see what other user or business outcomes there were, that we can add to the presentation. TODO: contact Unigigster founder and get an endorsement quote. TODO: contact Hoskan for the same.

To learn more HTML/CSS, check out these tutorials!