In Summer 2020, I worked as UI/UX designer in Logos, a news media start-up based in LA. I was in charge of designing the onboarding process for new readers and writers to set up their preference and help boost themselves. My work includes two prototypes of onboarding process, on mobile and desktop, and rebranding design system of Logos with two other designers. This documentation would focus on the first work I did.
As a new startup in news media industry, Logos aims to create a platform for readers to enjoy the reliable articles and discuss freely, while writers are able to express their opinions and gain reputation. To attract as more audience as they can, writers tend to build up profiles to improve credibility. On the other hand, readers want to read the topic they feel interested right after signing up. However, now the profile setting is hidden in a small section that is hard to find.How might we help readers and writers to set up their profile by designing the onboarding process?
Building a smooth onboarding experience. I built a quick onboarding process for new users in collaboration with CEO and PM.
My goal is:
1. Creating a smooth setting experience that is user-friendly in Figma.
2.Building up the responsive design for development.
The result is praised in the company and ready to deploy to website.
Currently, there is no onboarding instruction while signing up. So if the writer wants to set up their profile, they need to go find the profile tab to change the default state. For the readers, they are not able to choose the topics they are more interested or subscribe the writers they like.
After briefing, I sketched a simple page flow to get a better understanding on the whole experience. The design team especially discuss a lot on how to shorten the profile setting for writers while helping them building up an informative profile. I eliminate the unnecessary input fields and expand the important sections (Work Experience and Education) to two different pages, so that writers can freely expand their profile and not feel bothered by useless section.As for the visual, I collaborated with Chien-Chun Wu, the other designer in our team, to test out the new design system. I devoted myself to build up clean and professional visual style with the components he designed. Moreover, we benefit a lot from testing new system in responsive design, which gave us thoughts on the accessibility of components and style.
After several iteration, the page have more consistency and accessible.
My prototype includes:
1. New user flow for onboarding process with visual following the design system.
2. Responsive design for mobile users.