FamSync

UX Research & UX Design
The Problem
People with families and hectic lives often struggle to manage their schedules effectively due to the complexity of coordinating multiple events for themselves, their partner, and their children, as they are not always aware of each other’s activities. This lack of visibility and organization can result in overlapping commitments and increased stress.
The Goal
The family schedule-management app will allow users to plan and view each other’s schedules, helping those with busy lives and families stay organized. By enabling users to switch between various calendars, including a shared family plan, the app ensures that everyone remains aware of each other’s commitments.

Tools

  • Figma

Team

  • 1 UX Designer

My Role

    • UX Researcher
    • UX Designer

    Timeline

    • Overall: 12 weeks
    • Discovery & Research: 4 weeks
    • Design & Testing: 8 weeks

      Design Process

      01
      User Research
      02
      Wireframes & Prototyping
      03
      Usability Testing
      04
      High-Fidelity Prototype
      User Research
      01
      To initiate my user research, I conducted interviews with eight individuals of varying ages to gain insights into their general needs and preferences regarding daily scheduling. Initially, I assumed that individuals simply struggled with time management and balancing their schedules effectively. However, my assumptions evolved after the interviews, as I discovered that the primary challenges were related to balancing work and home life, and how various aspects of their lives influenced their scheduling.
      Pain Points
      With our initial interviews, we are ready to identify pain points by empathizing with users and addressing user needs.
      01
      Time Management
      Users need a way to organize their schedules so they can better manage their time.
      02
      Work-Life-Study Balance
      Users need to be able to balance their work with other aspects of their life.
      03
      Limited Time
      Users need a way to plan their day so they have time for other activities they have planned.
      04
      Productivity
      Users need to manage their multitasking in order to maintain their productivity with work and home life.
      User Personas
      Based on my interviews and research, I created user personas derived from the collected data. From these personas, I also developed a series of problem statements to address the specific challenges identified.
      Problem Statement: Neelam is a 35 year old teacher who needs a product that will help her stay organized and manage her time in the classroom and at home because she struggles with managing her stress as a teacher and parent.
      Problem Statement: Elliot is a 44 year old cook who needs a product that will help him balance his work and studies because he wants to spend time on his hobbies and with his family as well.
      User Journey Map
      Utilizing my user personas, I developed a user journey map to illustrate the sequence of experiences a user will encounter in order to achieve their specific goals. This approach allows me to empathize with the user by considering their actions, task lists, feelings, and potential improvements. By focusing on these aspects, I can ensure that the future product is designed to effectively meet their needs and enhance their overall experience.
      02
      Wireframes & Prototyping
      Based on the insights gathered from my user research, I was ready to begin the ideation stage. Before diving into wireframes, I developed user flows and storyboards to explore the user's experience through their actions and some visuals. Then I began creating paper wireframes, eventually moving to digital wireframes and prototypes.
      User Flow
      I depicted the user flow to the right to allow me to visualize the path the user will take from the start of the task to the end, with each shape representing a different action the user will partake in.
      Storyboards
      I then moved on to developing two different storyboards: a big picture storyboard and close up storyboard. The big picture storyboard shows the entire scene of why the user will be utilizing our product, while the close up storyboard depicts the user experiencing the app and focuses more on the product itself.
      Paper Wireframes
      For my paper wireframes, I initially sketched five different variations for each individual screen. I pulled my favorite components from the different variations to create the final screen for that page. I then did that for every page of my app until I ended up with my final five paper prototype screens shown below. My goal going into this was to ensure that each screen was easy to use and that the user understood the purpose of that screen.
      Digital Wireframes
      I took my paper wireframes and converted them into digital wireframes using Figma. I noticed I missed a screen during my initial wireframes, so I went ahead and added it into my digital version.
      Prototyping
      Once my wireframes were complete, I moved into the functionality of my product, focusing on how the screens work together and how the customer could interact with the product. Using Figma, I began prototyping to depict the usability.
      03
      Usability Testing
      With the completed wireframes and prototyping of the product, it was time to move on testing. I conducted a usability study to test how participants interacted with the product when guided with specific prompts.
      Before beginning testing, I created a UX research study plan outlining the research questions, key performance indicators (KPIs), methodology, participants, and script.

      I conducted an unmoderated usability study with five participants focusing on these KPIs: task success rate, time on task, and user error rates. Using a note-taking spreadsheet, I took detailed notes on the participants' click path, some observations, quotes, and task completion.

      For an in-depth view of the research study plan and usability study spreadsheet, please refer to the complete documents available below.
      UX Research Study PlanUsability Study Notes
      Research Study Plan & Usability Study
      Affinity Diagram
      After collecting all the data, it was time to begin sorting and grouping these observations through an affinity diagram. Using Figma, I categorized and clustered sticky notes together to create different groups: Plan Confusion, Reminders Page, UI/UX Elements and Miscellaneous. Within these groups, I developed subcategories to hone in on specifics of each group.
      Patterns and Insights
      Using the groupings from my affinity diagram, I started identifying themes and patterns, which I then refined into actionable insights.
      01
      It was observed that 5 out of 5 participants struggled with adding and finding the “Reminders” page. This means that navigating to the “Reminders” page is a struggle for a majority of people.
      02
      It was observed that 3 out of 5 participants were confused about switching between plans. This means that interchangability of viewing different schedules is difficult for almost all users.
      03
      It was observed that 3 out of 5 participants wanted the plan they were in to show on the screen when they were picking between plans. This means that users want to be able to see what plan they picked and are viewing at all times.
      04
      It was observed that 4 out of 5 participants displayed that some of the UI elements were distracting or confusing to look at. This means that users want simplified and easy to use UI elements when interacting with the app.
      05
      It was observed that 2 out of 5 participants did not know how to add a reminder on the “Reminders” page. This means that the functionality of the “Reminders” screen is not up to par with how the page should be used.
      High-Fidelity Prototype
      04
      Drawing from my insights and the feedback received, I concentrated on enhancing the visual design in my mockups. I crafted a comprehensive style guide emphasizing color, iconography, and typography, and then initiated the prototyping process.
      All Mockups

      Key Takeaways

      What I learned:
      Throughout this project, I gained a deep understanding of how essential it is to prioritize user needs from start to finish. Conducting usability tests was one of the most helpful aspects, as it provided me with real life insight of how users interacted with the product and revealed areas that required improvement. This experience reinforced the importance of maintaining a user-centered approach and refining the design to better suit the user.

      In addition to improving my skills in Figma, this project allowed me to develop a more structured approach to the entire design process. I learned the value of thorough research and how to effectively iterate based on feedback. By experiencing each phase in detail, I was able to refine my technical skills and enhance my ability to solve problems creatively, ensuring that every decision was based around user experience and functionality.
      Next Steps:
      To further refine this project, I would conduct additional rounds of usability testing with a broader audience to gather more diverse insights. This would help identify any remaining usability challenges and opportunities for enhancement. I would also explore adding more personalized features to improve the overall user experience and increase engagement.
      Back to Top