Workin Co. — UX/UI Case Study
PROMPT / SCOPE
About a year ago I made the jump from full-time employee, to full-time remote employee with Comfy. This happened because I had decided to move back home to Miami under a fairly short timeline. I was really grateful and excited to have a flexible work lifestyle and join the ranks of the digital nomads, however, this lifestyle came with lots of challenges that I had underestimated. The more I met freelance folks/other fellow remote workers, the more I realized that these challenges were NOT unique to me. The remote life (while glorified) has it’s pros and cons like anything else, and when tasked with creating my capstone project, the cons began to look like giant opportunities for improvement.
SURVEYS -IS IT JUST ME, OR…
I immediately knew I needed to find a coworking space to work from. I asked around and would come up with a handful of names. I lived near the downtown area and figured there had to be some nearby. I took to Google and began my search. There were far more coworking spaces than I had realized. This was good! However, this also lengthened my process. I found myself looking for a space for weeks, creating spreadsheets on the varying amounts of information on each (some sites had prices, some didn’t, etc), making phone calls, looking up reviews, scrolling through Facebook pages that were outdated, and other dead ends. It was pretty exhausting. “Isn’t there like a Yelp exclusively for this stuff?” (There was, but for some reason I had not seen it in my search.)
Meanwhile, this extended the amount of time I had to work from home. It started to become more challenging and isolating — I missed people!
Inspired by my own personal experiences, I set out to understand the personal experiences of others through a survey.
USER INTERVIEWS
My three biggest insights from my survey were that people definitely had struggles working from home, they worked their best around other folks and not in pure isolation, and that co-working spaces are really expensive. I wanted to gain a better understanding of how freelancers/remote workers cope with this, and what other struggles they face throughout their day-to-day, so I interviewed a handful of people.
SYNTHESIS
After my interviews I synthesized all the feedback into an affinity diagram using Trello. I used the MOSCOW method and split my interview findings into “People” and “Spaces” and gave each interviewee a designated color to see where all the overlapping sentiments were.
USER PERSONA
Based on all the stories, stats, demographics, and experiences from the folks I had interviewed, I created Freelance Frida — an amalgamation of everyone’s most common denominators. Frida would serve as my compass while I tried to find ways to meet her needs without projecting too much of myself onto her.
Basically, Frida didn’t manage her time in the most optimal way (maybe she should look into Polaris?). She would start her day a bit later than she should, dilly-dally with breakfast and other house related things, and then awkwardly try to find a solution leaving her frustrated and unproductive. What were her current viable options?
COMPETITIVE ANALYSIS/ INSPIRATION / VALIDATION
In my search for competition, I came across Coworker, which was perhaps the only solution outside of a co-working space that was trying to solve the whole “Where the heck do I work?” issue. Coworker aims to be a global database for co-working spaces. It’s basically what I needed when I was looking for where to work in Miami, aka a “Yelp for coworking spaces”. However, Coworker didn’t really address the cost issue that was the real #1 barrier to the solution. You were still at the hand of each coworking space’s individual membership which can be upwards of $300 a month. Not really ideal if you’re bootstrapped.
There were other things I found like Breather which allowed to you rent a conference room or space to work from for hours, but the price points also made me think they were more ideal for companies who needed extra space on demand, or small teams who needed to change it up. At $75/hr for example, it’s not really feasible for every day use.
Remote Year is not a competitive solution, but a concept that just validated the growing interest in being a digital nomad. The other logos like Eventbrite, LinkedIn, and Meetup represent how remote/freelance folks are currently connecting (but again, these only tackle a fraction of the problem).
Finally, my inspiration for a solution stemmed from a fusing together two different approaches; one from Classpass and one from Roomster. Folks would be able to connect to people and places in one platform (similar to Roomster’s platform of roommates + apartments) and work from different coworking spaces in the area on-demand under one membership (similar to Classpass).
WIREFRAMES
As soon as I narrowed down the backbone of the features, I started to sketch out the wireframe.
I was able to test the mid-fidelity prototype and and change things like CTA’s, on-boarding language, scale, and flow before moving on to branding.
BRANDING
For the visual system, I wanted to create something young, sleek, “mid-century modern”. I was inspired by vintage motifs, geometric icons, minimalism, and what I call “hipsterism”. I may have made that last one up but I’m positive you’ll get the gist of it by looking at this mood board.
STYLE GUIDE
Because Workin Co. would ideally work with strong brands like WeWork (or alternatively compete with them) I wanted to keep the brand really sleek and contemporary. I chose to keep the color palette relatively monochromatic, and incorporated custom iconography for the nav-bar to keep a sense of hip uniqueness to the app.
To create the systems in a more agile way, I followed the atomic design method of nesting items as atoms, molecules, and organisms. During my process with Polaris, it was a little difficult to grasp the concept, but by this design I had successfully figured out how to make my life easier with a competent understanding of ‘symbols’.
This made the usability testing phase that much more lean. I was able to A/B test different CTA designs for the Coworking space profile component (shout out to Instagram’s poll feature), and quickly see where opportunities for consistency were throughout the UI.
HI-FI USABILITY TESTING
While testing the prototype with several users, I got a lot of the same feedback around font choices (I was really rooting for ‘Playfair Sans’ to stick to my mood-board, but many users felt it was “out of place” with the branding creating unintended dissonance) and flow (not being able to navigate off a page/other redundancies). I also got feedback around my happy path which greatly helped me refine the MVP to what it is now.
FROM HAPPY PATH TO REALLY HAPPY PATH
After hearing feedback from one of my original interviewees about how they couldn’t relate to the chosen ‘happy path’, I realized that I was missing huge opportunities to show how Workin’ Co. could solve their problems. If this were to be a true MVP, my flow would have to resonate with my potential users.
“I just don’t think I’d use that part of the app. Like, I wouldn’t randomly message someone and ask if they want to work together — it feels creepy, right? I’d have to maybe have seen them around a few times first.” — Laura
After hearing that feedback, I was reminded of a talk I attended at Unbound conference, where I overheard WeWork’s Bobby Condon mention how valuable having access to the global WeWork community was to their members, and how they could basically access that through their member app. Being a member myself, I realized that the “access” he was talking about lived in a “newsfeed” tab of sorts — at this point, a pretty standard feature in any social app. “Of course,” I thought. Sometimes all people need is a push or a reason to communicate: a prompt.
I took to Sketch and then reimagined the structure of the app so that the ability to “meet” (community) and “work” (workspaces) were still given equal importance, but broken out in their own spots on the navigation rather than split out from “discover” (which in retrospect felt pretty vague). This gave me the ability to then use the split sub-nav in community for “meet” and “share”, which would act as the member newsfeed and give users who needed it a way to break the ice and connect easily. Hopefully, this would also avoid the whole potential creep-factor-awkward-icebreaker situation all together, but I can’t make any promises.
Check out the final flow below!
NEXT STEPS
If I were to continue to iterate on this, I would next flesh out the “filters” on the ‘Workspace’ tab, perhaps add a filter to the ‘Meet’ tab so folks in similar industries can connect, create some prototypes of a desktop version, work on the micro-interactions, figure out where notifications really need to be and if users want a catch-all notification center, and of course, as always — continue to test and discover.
