The Challenge
Cafe Captivability
Workfrom is a virtual meeting platform that builds a sense of community through the personalization of public virtual cafes. Prior to COVID-19, Workfrom.co functioned as a type of “Yelp for remote workers”. The pandemic caused a 90% drop in user activity. Workfrom found a unique opportunity to take what they’d learned about the pros and cons of various remote working sites through their own platform and put that data to use. Thus, they’ve created a state-of-the-art virtual platform to connect their users with each other in shareable, customizable cafes.
Our team was tasked with creating a captivating, easy-to-follow onboarding process to showcase the site’s various customizable features. We also determined that Workfrom would benefit from a refocus of their brand design to more accurately convey their narrative for virtual cafe-goers.
Timeline: 3-weeks
Tools: Figma, Adobe Illustrator, Adobe Photoshop, Miro, Trello
My Role
I played an integral role in the development of strategy and the implementation of the onboarding experience. Apart from that, I was solely responsible for designing the refocused brand aesthetics of the site. I led the UX & UI work, producing all major deliverables, which I presented to the client from December 2020 - January 2021.
A Latte to Learn
We began our research by identifying Workfrom’s placement on the spectrum of virtual meeting platforms. Our competitive analysis found Workfrom to possess qualities wholly dissimilar from the other platforms we examined. While other platforms focused on team collaboration, Workfrom envisioned a refreshing experience: a comfortable, casual retreat for users’ headspace, reminiscent of pre-Covid daily life. Where other platforms struggle with the obstacle of meeting room interlopers, Workfrom embraces the transient nature of a bustling community, opening its doors for comers and goers, asking them to stay as long as they’d like, and only as long as that.
To map a beginning design strategy, we looked to other prominent meeting platforms. Through this, we pinpointed key essentials relating to feature inventory, usage tutorials, and sign-up pages necessary for a successful, intuitive product. With our catalog of tools laid out before us, we crafted an initial hypothesis. Then, we went to the users and asked them what they think.
User feedback presented us with a dilemma. The feelings our subjects expressed produced generally similar results. They overwhelmingly reported missing the feeling of emotional connectedness, to the extent that the visual appeal of a virtual space was mostly an afterthought. They enjoyed the community effect, and enhanced productivity garnered from the feeling of working near other humans. This ran in direct contrast with the client’s desire to focus on attractive visuals.
Our next step was to identify, in broad strokes, what kept Workfrom’s current user base coming back and what drove new users to it. We asked open-ended questions and let them explore their feelings more abstractly than we would normally require but found necessary here. Through this, we shaped a more accurate representation of what users are getting out of their virtual cafes and what they hope to get in the future. We interviewed four remote workers from different professional backgrounds, but their feelings on the cafes were all the same. They enjoyed the ambiance, community effect, and enhanced productivity gained from the feeling of working near other humans. They enjoyed the idea of a “heads down” virtual workspace where hosts can easily send out their link to their network. We affinity mapped our user responses and found several trends among the user behaviors.
Isolated Ivan
By consolidating findings from the research, we generated Isolated Ivan, our user persona, who represents our ideal Workfrom cafe host. Isolated Ivan needs a place to connect, network, and work in a virtual environment because his usual coffee shop is closed. Ivan uses countless meeting and collaboration platforms, and the last thing he needs is another complicated and bloated site. Therefore, he needs a simple way to create and enter his custom cafe with easy sharing to his network.
“I want to create a virtual workspace because I value a communal work environment.”
Problem Statement
Our team reflected on Isolated Ivan, his emotions, and behaviors around virtual workspaces and was able to identify his main problem:
Due to Covid-19, Isolated Ivan needs a way to create a virtual workspace because he values a communal work environment.
Meet Muggly
We revisited our comparative analysis findings and took from the successes of Duolingo and Headspace’s onboarding processes. From this, we learned that character-driven onboarding was most effective because it provided their users with a delightful learning process, exactly what our client had stated they were interested in implementing. With our findings, we created Muggly, a splendid little mug hired to instruct Workfrom hosts on how to customize their cafes.
Brewing the Coffee
Contrary to feedback from our user interviews, and against our own instincts, our team continued, at the client’s urging, to lean heavily towards site customization. We were uncertain of our direction as cafe hosts had expressed little interest in personalizing their cafes, but it was a feature our client was excited to showcase.
The onboarding process included a feature that asked new hosts to identify the purposes of their cafes and desired privacy preferences, based on a multiple-choice selection of answers. Once a cafe went live, its host’s answers would be used by cafe goers to find and join cafes matching their interests. To address the users’ indifference to personalization but also adhere to the client’s desire to showcase the site’s customization features, we incorporated into the mid-fi prototype, quick-select background presets.
We conducted three usability tests with users who were interested in the platform for either personal use or team engagements. Our tests made it abundantly clear that, even with the streamlined options, there was still little interest in customization. They found Muggly to be annoyingly reminiscent of Clippy, Microsoft Word’s early paperclip character, and they were vehemently opposed to the mug’s conversational chatter. “I hate Muggly,” was one of the most cogent opinions we noted about the mug. Users were also uninterested in making selections about their cafes’ purposes, and they were confused by the various icons displayed throughout the site. To all aspects of personalization or customization, which did not pertain to site utility, the users reacted with disinterest and dissatisfaction. They just wanted to get into a room. It was back to the drawing board, where some tough decisions would have to be made.
A Simple Cuppa Joe
Despite the client’s desire, we determined that the best chance at success for the platform would be achieved by listening to the users. We could now design, per their expectations, an elegant, simplistic onboarding process. Moving into hi-fi, these are the key changes we made throughout the process:
Disregard Muggly
Insert users into their personal cafe immediately after creating an account
Provide users with the opportunity to skip the onboarding process
Include Workfrom’s conversational tone
Replace current icons with universally recognized symbols
Organized site
Click Image Above to Create Your Cafe
Next Steps for Success
Design
Build design style and brand
Play with and test conversational text to balance brand voice with what users respond to
Refine interactions by testing them in code
Business
Build white-label features and pricing plans
Get people in the cafe
Encourage sharing