Bailiwik is a place-based social media app where users can create smaller scaled groups based on their geography. I have moved over 20 times in my life, and I found that joining community groups helped me better adapt to every new place I moved to. I felt aligned with Bailiwik, as they are trying to create an app where people can find local communities that can meet both online and offline.
After the app’s initial launch we discovered that the concept of a Bailiwik was unclear to the new users. How might we clarify the app's vision and purpose?
A complete redesign of on-boarding and creating a Bailiwik flows to make sure new users understood what the app was for. A Bailiwik is a small community anyone can create and invite people to join. The app is a facilitator to bring local communities together.
Research to understand and empathize with user needs and behavior
Brainstorm potential solutions to the pain points identified
Brainstorming, sketching, user flows, co-creation workshops
Design the interface to visualize the solution in various fidelities
Wireframes, pseudo design system, mockups, clickable prototypes
Test the design and iterate based on findings
Usability testing, user interviews
After the app launch, we found that until someone explained the app to a new user or until a new user took time into exploring the app, the app concept was hard to grasp which affected user retention. It put the lift on our business development team to explain the app, and the app did not speak for itself.
I advocated for user research to understand the underlying reasons why that was the case. We conducted unmoderated user testing on 8 participants. We conducted 8 tests as 85% of usability issues can be found with 5 participants, and we were targeting several demographics.
We decided to focus on redesigning the on-boarding and creating a Bailiwik flow, as not knowing the app's purpose may correlate with our user retention. We analyzed our existing user flow to pinpoint blockers and triggers that led to confusion. From there we brainstormed items to incorporate into our designs to clarify the purpose of Bailiwik and creating a Bailiwik.
A development agency led the design for the initial app launch. Therefore, our design files lacked organization and consistency. In lieu of redesigning the app, we created a component library to make all elements in the app consistent. Since the UI elements were somewhat determined in the first iteration, we created consistent elements in efforts to design and develop more quickly in the long term.
We created mockups using the existing components we had. Since we already had everything componentized and brainstormed the functionality together we went straight to mockups. We also created clickable prototypes for each which we used to obtain user feedback.
We created an optional on-boarding sequence a new user can swipe through that describes what a Bailiwik is (a placed based online community) and branches the sign up flow to users who want to host a Bailiwik or join a Bailiwik.
The existing create a Bailiwik sequence had little instruction on the purpose behind some of the actions. In our updated flow we incorporated instructions as well as closing the loop by ending the experience with inviting friends to join the new Bailiwik.
Through stakeholder feedback, we improved the mockups through multiple iterations before handing off to development.
Research can be done with minimal time and budget and can produce great insight. Seeing how users go through your app and understanding the blockers in the current experience helps our solution grow further in the direction that users will feel useful.
Communication with the developers throughout the entire process is important to be in sync, and to make sure the product we are creating is both functional and doable. Understanding what is technically possible has made my designs more thoughtful of the development process.
Bailiwik had a UI in place when I joined the project. However, it was not componentized. Compentizing all elements sped up the work and also creates a consistent interface throughout the app.