About the project
Pawjourr is a social media influencer marketplace designed to connect pet brands with content creators who can promote their products and services on social media. With the rise of pet influencers on social media, Pawjourr aims to provide a platform where pet brands can easily find and collaborate with creators to reach their target audience.
As a UX/UI designer, I contributed to the project end-to-end, conducting research, wireframing, visual design, prototyping, usability testing, and cross-team collaboration to create an optimal user experience for both brands and creators on the platform.
Role
User Research, Visual design, Prototyping & Testing
Tools: Pen & paper, Figma, FigJam, Asana, GSuite
Tools: Pen & paper, Figma, FigJam, Asana, GSuite
May 2018 - Dec 2019
Overview
Pet brands struggle to effectively promote their products and services on social media, as it can be challenging to identify and connect with relevant pet influencers who can create authentic and engaging content. At the same time, content creators who specialize in pet-related content often face difficulty in finding appropriate campaigns and collaborations that match their interests and abilities. This gap in the market highlights the need for a platform that can effectively connect pet brands with relevant pet influencers, allowing for more authentic and engaging promotions on social media. The problem is further compounded by the lack of existing platforms that cater specifically to the niche of pet industry, making it difficult for pet brands and creators to connect in a meaningful way.
“Our goal is to improve the user experience of creators on Pawjourr and make it easier for them to find, apply and manage their job applications.”
DESIGN PROCESS
During the time I joined the team, they had a landing page for marketing with basic details to educate the both type of the main user groups and most of the work was done manually by campaigns management & operation team, and business development & partnerships team. I conducted one-on-one interviews with both existing users and the Pawjourr team. There were another graphic designer and a design intern who were helping me with most of the user research activities. We used a semi-structured interview format, asking open-ended questions about their experience using the platform, challenges they faced, and suggestions for improvement. We also conducted a competitive analysis to identify industry trends and best practices.
We kicked off the project by conducting UX discovery workshops. While doing this I added some of the methods outlined in "The Sprint" by Jake Knapp, to make the process a little bit faster. The workshops involved participants from the Pawjourr team, including product managers, developers, marketing and customer support representatives. We conducted various activities during the workshops, including:
Redefining user personas
We created personas for both brands and creators, which helped us empathize with their needs and goals and prioritize design solutions.
Writing How Might We’s
Writing HMW’s was fun and helped generating potential solutions to the identified problems and challenges in the user research phase.
Mapping the current user flow
We created a user flow diagram to identify the different steps that both user groups need to take to on the platform such as creating jobs, applying for jobs, and application tracking.
Brainstorming design solutions
We wrote user stories, and the user journeys, and conducted ideation exercises using techniques such as "Crazy 8s" to generate a wide range of design solutions.
Here are few visuals from few of our activities we did on FigJam during some of the workshops and user research:
We synthesized the data gathered from the UX workshops and user research to identify common pain points and design opportunities and prioritized design solutions. Since there were three main parts for this product as the landing page, creators’ dashboard, and brands’ dashboard, we planned to start with creators’ dashboard to get things going fast. And planned everything according to the product roadmap and used Asana to keep everything organized and cross-functional.
DESIGN
We brainstormed design solutions and prototyped ideas using sketching and wireframing techniques. We iterated on our designs based on feedback from the Pawjourr team and user testing.
Wireframes
When ideating our design ideas, I usually prefer sketching using pen and paper or drawing on iPad, and sharing it with the team, discuss and get feedback.
A sneak-peek to the design system
When I joined the Pawjourr team, one of my key responsibilities was to establish a design system that could be used across all teams, from development to marketing. I noticed that the existing style guide was insufficient for the project's needs, as it lacked a cohesive set of design guidelines and didn't follow web accessibility guidelines. To address this, I collaborated with the graphic designer and interns on the team, and together we created a new design system that was both functional and visually appealing. We made sure to adhere to web and accessibility guidelines as much as possible, and dummified the design system to ensure that it could be used by anyone on the team, regardless of their technical expertise. The result was a comprehensive design system that not only supported the creation of high-fidelity mockups, but also served as a valuable resource for the marketing and sales teams to use in their outreach efforts. Here’s a sneak peek to the basic styleguide
MOCKUPS
After finalizing our design solutions, we created visually appealing high-fidelity mockups and prototypes using Figma that aligned with Pawjourr's brand guidelines. We iterated on the design until we achieved the desired user experience. To validate our design solutions, we conducted usability testing with a group of users and observed their interactions with the platform. We also gathered feedback on the new features and design changes. Additionally, I took a mobile-first approach and ensured the designs were responsive for optimal user experience on all devices. Please note that the designs showcased below represent only a small portion of the entire Pawjourr platform. As a large-scale SaaS platform, Pawjourr encompasses several products and features that cater to the needs of pet owners and creators alike. While these designs provide a glimpse into the UX/UI design process, they do not cover the entire range of features and products offered by Pawjourr.
WORKING WITH DEVELOPERS
As part of the design process, I collaborated closely with the development team to ensure that the designs were properly implemented. I worked closely with the CTO and two engineers to develop the designs for MVP, providing them with detailed explanations of how the prototype should function and where micro-interactions were needed. To speed up development, we used inspiration from Tailwind UI and DaisyUI components, which were based on Tailwind CSS. We also agreed to use an icon pack from react-icons to streamline the development process. Additionally, I helped the developers set up storybook, taking inspiration from the Vibe Design System by Monday.com to ensure that the design system was scalable and maintainable. Through this collaborative effort, we were able to create a cohesive and functional product that met the needs of both the creators and brands on Pawjourr.
TAKEAWAYS
Throughout this project, I learned the importance of collaboration and communication with cross-functional teams. By conducting user research and testing, I gained insights into the needs and pain points of both the creators and the brands, which helped me to design a more user-friendly and effective product. I also found that creating a comprehensive design system was essential in ensuring consistency and efficiency across all teams. Additionally, working closely with developers was crucial in bringing the designs to life and ensuring a seamless user experience. Overall, this project allowed me to develop my skills in UX UI design, communication, collaboration, and project management, and I am proud to have contributed to a product that helps pet brands and creators alike.
To sum up, when working in a startup there’re few things we always need to be aware of,
1. Flexibility: Working in a startup requires a lot of flexibility and adaptability. Things can change quickly, and you need to be able to pivot and adjust your approach as needed.
2. Collaboration: Collaboration is key in a startup environment. You need to be able to work closely with other team members, communicate effectively, and be open to feedback and ideas from others.
3. Agility: Working in a fast-paced environment requires a certain level of agility. You need to be able to work quickly and efficiently, while still maintaining a high level of quality.
4. Prioritization: In a startup, there are always more things to do than there is time to do them. Prioritization is key to making sure that you're focusing on the most important tasks and making the most impact.
5. Empathy: Understanding the needs and perspectives of your users is critical in any UX/UI design project. In a startup, it's especially important to be able to put yourself in the shoes of your users and understand their pain points, challenges, and goals.