How to Logic Pro

Executive Summary

Role: User Interface Designer

Timeline: Sept-Oct 2022 (2 months)

Team: Individual Project

Tools: Figma

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Goals

  1. Create an effective & informal prototype that demonstrates an understanding of the required learned concepts
  2. Demonstrate an understanding of user interface design and apply it throughout the tutorial
  3. Provide a memorable and comfortable experience for users

Process

The class was introduced to three different phases in order to complete the design process. The first phase was Proposal Writing, where I was able to elaborate on how I applied the laws and principles of User Interface Design in my final project. The second stage was Project Development, which was the creation of the prototype and consisted of constant feedback from the class. The final stage was Revision, where final thoughts and comments were discussed before moving forward and finalizing the project.

Proposal

The project proposal is essentially explaining the concepts of User Interface Design and describing the features of my Final Project using the principles covered in the class. My proposal focused on creating an informational prototype on how to change an audio tempo file and how to upload a new plug-in on Logic Pro. Through Figma, I was able to design a high-fidelity, where I implemented my comprehension of the user interface design concepts.

User Interface Design Concepts

Three of these principles will be discussed and will be represented in how they made an impact on my project. I will include the definition of each principle, a description of how the principle was used, and an accompanying image.

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Law of Proximity

The Law of Proximity states that objects that are proximate to each other are often perceived as a group. Therefore, I designed and integrated a group of small circles for the progress bar. The proximity of the small circles was positioned to allow the circles to be seen as a group and was easily recognized as a progress bar for the users' progression.

Our Interviewees

We thank each one for their cooperation.

Zeigarnik Effect

The Zeigarnik Effect states that people are more likely to remember incomplete or interrupted tasks than completed tasks. I included a progress bar that will demonstrate this effect by providing the user a reminder and clear indication of the tasks that remain incomplete and of their overall progress throughout the tutorial. This essentially guides them to comprehend and recognize the steps from start to end.

Von Restorff Effect

The Von Restorff Effect states that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered. Throughout my prototype, I took advantage of this effect by highlighting or boxing important keywords, to provide memorable steps for the user.

Takeaways

As I worked on my tutorial, I acknowledged the importance of the design principles in User Interface. My tutorial demonstrates the significance of each principle and how they impact and correlate to the design aspect of everything. Furthermore, this allows users to grasp a better understanding of how the elements make an important influence in the design world. With the knowledge and resources that I've acquired from this prototype, I recognized that with this new understanding, I'm looking forward to starting on more challenging projects.

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Report

For our project, we constructed a report that contains our data and analysis of Sin-K. We designed the report on Canva and developed the content on Google Docs in less than two weeks.

Report

Overview

Physique is an iOS mobile prototype where users can connect, share, and find workouts, discover nutrition habits, and even track their routine and nutrition with others through a positive and welcoming platform. My team’s primary goal was to surface challenges such as integrating a fitness and social media platform into one, creating an interface to display an engaging and positive community, and how to guide users to share their fitness journeys with others.

The purpose of Physique was to create a welcoming community where users can share their fitness journeys and motivate others to reach their personal fitness and wellness goals. The main problem we were trying to solve was finding a way to successfully integrate a social media and fitness platform into one without the negative backlash and false information social media advertises. Furthermore, my team was also focusing on ensuring the application had an organized structure to showcase unique features from the merging of two different platforms, creating a seamless experience for users.

Role

Lead UX Designer
Product Manager

Timeline

February - April 2022

Approach

Goal-Directed Design

Tools

Canva
Discord
Figma/FigJam

Phase One

Problem Statement

Existing fitness and social media platforms prioritize false advertising of exercises and diets, neglect health, and focus solely on monetization and algorithmic bias of user accounts. Our app will fill this void by offering an enjoyable, personalized, and welcoming merging experience, featuring an overview of weekly statistics, an engaging community feed, and a customized profile page.

Method

In this project, we employed the Goal-Directed Design (GDD) process, a product design methodology developed by Alan Cooper. This approach prioritizes crafting designs that align with user needs and goals while also addressing business requirements. The subsequent sections will walk you through each phase of GDD, starting from Research to Refinement. Within these sections, you'll find documentation that highlights insights, challenges, and solutions identified by our design team. This project was undertaken as part of the IAD3000 (Interaction Design I) course at Kennesaw State University under the supervision of Dr. Michael Lahey.

Phase Two

Research

The Research phase of Goal-Directed Design focuses on collecting qualitative data and pertinent information about the subject, domain, and potential users relevant to the product. This phase consists of four major steps: Kickoff Meeting, Literature Review, Competitive Audit, and User Observation/Interviews.

Kickoff Meeting

During Kickoff Meetings, stakeholders introduce the project idea to both design and development teams, which delve into discussions about users, competitors, and challenges, engaging in brainstorming sessions to address fundamental questions. In our class project, there was no official kickoff meeting.

As the team leader, I chose a collaborative approach for the Kickoff Meeting and Stakeholder Interviews. I conducted an affinity map session to brainstorm and collaborate, then assigned each team member a specific part of the research process.

Literature Review

The Literature Review allows designers to dive deeper into relevant literature concerning the upcoming product and its domain. This step is crucial as the gathered insights serve as the foundation for more informed stakeholder and subject matter expert (SME) interviews. I tasked my team individually in this section, focusing on researching nutrition, social media, fitness, influcencers, and current technology that is thriving in the market.

Competitive Audit

In the Competitive Audit phase, the design team reviews systems, interactions, and interfaces of existing products in the same domain. This helps designers understand the strengths and limitations of specific features, along with trends and design patterns in comparable products on the market.

In this research phase, my team and I extensively explored our competitors to comprehend their perspectives and approaches to product development. We specifically studied successful fitness apps like Nike Run & Training Club, Apple Fitness +, Fitbit, Strong, and MyFitnessPal. Analyzing these apps enabled my design team to identify areas where we could enhance our offering in the market. Through thorough observation and analysis of each platform, we gained a clearer understanding of our objectives. Moreover, aligning with our kickoff meeting statement, my design team and I will concentrate on features, reminders, pricing, and the capability to export/import data from wearables like Apple Watch, FitBit, or Samsung Watch, to grasp an understanding of what's been working in the market.

Phase Three

User Research Interviews

In Goal-Directed Design, ethnographic interviews are used to gather essential qualitative data, providing a deeper insight into users and their goals. This approach combines interactive observation with guided interviews, seeking to understand interviewees' contexts and comprehend their attitudes, beliefs, and values related to the product's domain.

The user research process started with creating the Persona Hypothesis, a set of assumptions about potential users and the behavior variables to be observed. The team decided to focus on variables related to interviewees' activities, attitudes, motivations, and skills. Due to the ongoing Covid-19 pandemic, in-person user observations were not possible. However, we conducted five online interviews with college students who matched our Persona Hypothesis profile, all conducted via video calls.The majority of our users were in their early twenties and had embraced a fitness lifestyle at some point. With each interviewee having a unique approach to staying fit, we aimed to design an app that brings together individuals with various fitness preferences to connect and learn. Additionally, we inquired about their nutrition practices, including whether they track calories, engage in meal prep, or follow a specific diet to complement their lifestyle.

Through the conduction of five user interviews, my team was able to gather patterns, responses, and diverse viewpoints from individuals to pinpoint and finalize an improved comprehension of our data to create our user personas.

Affinity Mapping

Affinity mapping enabled my team and me to observe recurring characteristics in each interview. As we conducted interviews, we identified a consistent pattern of overlapping behaviors, thoughts, and observations that caught our attention. After completing the interviews, we collaboratively discussed our notes, identifying similarities and connecting points to create groups that incorporated the main observations derived from each interview.

Affinity mapping example 1

Affinity Mapping Insights2/5

Phase Four

Modeling

The modeling phase in Goal-Directed Design required my team to craft primary and secondary personas, portraying the perspectives of users. Personas, though fictional, are models constructed based on behaviors and goals, representing a broad user group. They offer a clear insight into how different users may behave and their reasoning. Personas play a vital role in Goal-Directed Design as they guide the development process, focusing on user goals. Informed by research and behavior patterns, our personas enabled us to design for specific individual types, addressing various challenges that can hinder product development. They served as a powerful means of communication and analysis, ensuring that the design was thoroughly understood and appreciated by users.

Roxie serves as our primary persona, representing the central focus for Physique. She embodies behaviors like the desire to incorporate exercise into her daily routine, along with motivation and consistency to attain her fitness goals. She desires to be part of a community that inspires her to become a better version of herself.

Lucas, our secondary persona, mirrors behaviors such as maintaining a structured schedule and fitness routine, displaying a passion for workouts, and actively sharing fitness information.

Primary Persona

Secondary Persona

Phase Five

Requirements

The Requirements phase in GDD is important since designers turn their research and observations into solutions that meet user needs. They consider technical constraints and ensure alignment with business goals. As a team, we crafted context scenarios—narratives illustrating the imagined activities of the persona. This approach facilitated the identification of requirements aligned with the structure and functionality of our app. Essentially, our primary goal was to deliver an app where Roxie could learn and explore the path to health within a positive and supportive community.

Key requirements include:

A visually appealing integration of fitness and social media
A dashboard displaying weekly statistics on nutrition and personal stats
A feed to observe the journeys of those you follow
A Profile Page for sharing personal fitness journeys, routines, and accessories.

Phase Six

Frameworks

In the context of GDD, the frameworks phase allowed us to sketch a rough draft of Physique by incorporating key paths and validation scenarios. This phase enables visualization of user goals, behaviors, and needs in a wireframe, outlining the user's journey through a low-fidelity prototype. Once we had a clearer understanding of our requirements, we seamlessly transitioned to frameworks to bring our vision to life. Our wireframes maintained simplicity from start to finish, primarily focusing on outlining the app's structure. They served as a tool to illustrate how we intended to structure and incorporate functionality into the app, emphasizing simplicity and effectiveness. As each team member crafted their wireframes, various user paths became evident, streamlining the prototype process for everyone.

Regarding our wireframes, I realized that I overlooked the importance of this phase, which led to delivering inadequate skeletons. Underestimating wire-framing was the root of complications my team came across because it affected our comprehension and performance of our final prototype. We didn’t value the importance of a design system, components, and a visual system as a whole in the framework stage. Tackling the user interface design in small increments didn’t work effectively as we prioritized the overall appearance, rather than the entire experience.   

Key Path and Validation Scenarios

Phase Seven

Refinement

In the final phase, our focus shifted to prototyping on Figma, emphasizing the functionality of the app. We aimed to maintain a functional and user-friendly structure, transitioning from a low-fidelity framework to a fully functional, high-fidelity prototype. Our goal was to deliver an app that is both informative and helpful while being engaging and powerful. To provide a sense of comfort and balance, we incorporated certain characteristics from popular social media apps. We opted for simple, welcoming, and balanced colors to ensure a positive user experience.

Following two usability tests, we received feedback confirming a seamless flow and an effective overall experience. Acknowledging this feedback was crucial to avoid potential complications and frustration for users, a priority we aimed to uphold, particularly in the context of social media.

Furthermore, I created our logo to finalize the brand identity of Physique for my team. This served as a visual representation to convey the value, communicate the brand's identity, establish a memorable and distinctive presence, and foster recognition among the target audience. As a team, we knew it would create brand awareness and leave a lasting impression on consumers.  

Logo Alternative

Black and White Logo

Official logo

Secondary Logo

Physique High-Fidelity

Phase Eight

Takeaways

Physique was my first experience in Interaction Design where I inclusively led and managed a product design project. It was an interesting opportunity to observe how we all collaborated to solve a problem. My team’s performance was always prioritized, therefore learning to balance out my team’s strengths and weaknesses to execute an efficient workflow was part of the challenge. However, we managed to circulate our schedules and tackle our pain points to get past our limitations.

After all, I understand the importance of organization and the Frameworks phase. If additional time was given, I would’ve implemented a stronger overview to structure our design insights during our weekly check-ins and project timelines. I think this would’ve helped my team to grasp a clearer perception of Physique, especially during the Frameworks phase. It all bounces back together, which demonstrates that an improved structure could’ve led to improved wireframes by following principles of information architecture and performing more well-rounded user interviews.

It was an exciting experience to not only create but lead a product design project from beginning to end. I learned the significance of creating seamless experiences requires patience, communication, and structure. I also learned that I enjoy guiding individuals and implementing a positive space to share and grow together. Thankfully, I can apply my knowledge and expertise in future projects and a team of designers!

How to Logic Pro

Role: User Interface Designer

Timeline: Sept-Oct 2022 (2 months)

Team: Individual Project

Tools: Figma

Prototype

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Goals

  1. Create an effective & informal prototype that demonstrates an understanding of the required learned concepts
  2. Demonstrate an understanding of user interface design and apply it throughout the tutorial
  3. Provide a memorable and comfortable experience for users

Process

The class was introduced to three different phases in order to complete the design process. The first phase was Proposal Writing, where I was able to elaborate on how I applied the laws and principles of User Interface Design in my final project. The second stage was Project Development, which was the creation of the prototype and consisted of constant feedback from the class. The final stage was Revision, where final thoughts and comments were discussed before moving forward and finalizing the project.

Proposal

The project proposal is essentially explaining the concepts of User Interface Design and describing the features of my Final Project using the principles covered in the class. My proposal focused on creating an informational prototype on how to change an audio tempo file and how to upload a new plug-in on Logic Pro. Through Figma, I was able to design a high-fidelity, where I implemented my comprehension of the user interface design concepts.

User Interface Design Concepts

Three of these principles will be discussed and will be represented in how they made an impact on my project. I will include the definition of each principle, a description of how the principle was used, and an accompanying image.

Law of Proximity

The Law of Proximity states that objects that are proximate to each other are often perceived as a group. Therefore, I designed and integrated a group of small circles for the progress bar. The proximity of the small circles was positioned to allow the circles to be seen as a group and was easily recognized as a progress bar for the users' progression.

Zeigarnik Effect

The Zeigarnik Effect states that people are more likely to remember incomplete or interrupted tasks than completed tasks. I included a progress bar that will demonstrate this effect by providing the user a reminder and clear indication of the tasks that remain incomplete and of their overall progress throughout the tutorial. This essentially guides them to comprehend and recognize the steps from start to end.

Von Restorff Effect

The Von Restorff Effect states that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered. Throughout my prototype, I took advantage of this effect by highlighting or boxing important keywords, to provide memorable steps for the user.

Takeaways

As I worked on my tutorial, I acknowledged the importance of the design principles in User Interface. My tutorial demonstrates the significance of each principle and how they impact and correlate to the design aspect of everything. Furthermore, this allows users to grasp a better understanding of how the elements make an important influence in the design world. With the knowledge and resources that I've acquired from this prototype, I recognized that with this new understanding, I'm looking forward to starting on more challenging projects.

Overview

Good Shit is an educational gut health tracker application that focuses on informing users about their digestion health and bowel movements. The primary goal was to inform, identify, educate, and value the importance of digestion health. Team Janice's focus was to surface challenges such as creating and integrating an informational gut health tracker, designing an educational yet informational platform where users can learn and understand their bowel movements, and incorporating medication and doctor consultations for users to become more knowledgeable about their digestion system.

Moreover, Team Janice recognized the challenges inherent in developing a holistic gut health tracker and educational platform. Creating an informational gut health tracker required thoughtful consideration of data input methods and user-friendly interfaces to ensure seamless tracking of daily habits. The design of the educational platform demanded a delicate balance between providing in-depth information about digestive health and presenting it in an easily understandable and engaging manner. Integrating features for medication tracking and doctor consultations posed technical challenges, such as ensuring data privacy and secure communication channels between users and healthcare professionals. Despite these challenges, Team Janice's commitment to fostering user awareness and knowledge about digestion health has resulted in the creation of Good Shit, a versatile and user-centric application that goes beyond conventional health tracking to address the broader aspects of digestive well-being.

Role

UX Designer
UX Researcher

Timeline

October-December 2022

Approach

Lean UX

Tools

Canva
Discord
Figma/FigJam

Background

What is Lean UX?

Lean UX is a user-centered design approach that integrates principles from user experience (UX) design, Lean startup methodology, and Agile development. It emphasizes a collaborative and iterative process focused on delivering value to users. Therefore, this method allowed us to prioritize outcomes over features. It centered on testing assumptions through minimum viable products (MVPs), gathering early feedback, and continuous iteration. Our class project, conducted for IAD4000 (Interaction Design II) at Kennesaw State University and supervised by Dr. Michael Lahey, followed this process.

Problem Statement

The purpose of Good Shit is to inform others about the importance of gut health. The established domain highlighted that several health-tracking applications fail to educate users and offer a proper structure to record logins of their own digestion health. Our initial problem statement was finalized towards the end of the project once we revalidated our findings. We concluded that 

The health and lifestyle field mainly emphasizes goal-setting for health-conscious individuals. Existing products fall short in explaining why gut health is the way it is. Our solution addresses this gap by allowing users to log bowel movements, identify patterns, and providing unbiased information on gut health. We target those curious about health, not just the health-conscious. Success for us is seeing active user engagement and positive recommendations.

Initial Proto-Personas

In Lean UX, Proto-Personas are hypothetical users embodying our team's assumptions about the potential users of our product and their motivations. These Proto-Personas can evolve within our timeline as the team gains insights from user research.

Following the identification of the business problem, we utilized outcome-to-impact mapping to brainstorm potential business outcomes. This led to the formation of assumptions about successful design features for our product. We applied these assumptions to identify the potential users who would benefit from our product. Team Janice crafted two Proto-personas based solely on these assumptions, understanding that they will change eventually through ongoing research and learning.

Primary Proto-Persona

Secondary Proto-Persona

Sprint Backlog

The Sprint Backlog is a list of design experiments (MVPs) that the team needs to build and test with users, organized based on priority. After forming our Proto-Personas, we defined the benefits and outcomes by understanding users' reasons for using the app. We then identified solutions, analyzed patterns, and shaped the desired outcome for Good Shit. Combining data from previous steps, we built hypotheses to test assumptions and gain a better understanding of essential learnings. These hypotheses were transformed into a product backlog, guiding the structuring of key statements. This process enabled Team Janice to prioritize and create our Minimum Viable Products (MVPs).

Sprint 1 Backlog

Sprint 1

MVP: User Research

Our team divided tasks for the first week of the sprint. Janice focused on creating a database of common causes of symptoms, Jordan designed screens for doctor's prescriptions and treatment info, Jessie handled the doctor consultation screens, and I worked on the products page, where users can explore popular products that can help with digestion or anything related to gut healing. Each of us developed our prototypes, and before the initial interviews, we merged them. After building our assigned features, we formulated interview questions and conducted interviews with three potential users. One team member moderated the session, while others facilitated and took notes.

Stand-Up Meetings (Daily Scrum)

To maintain responsibility and team alignment, we held short planning meetings every two days throughout the project. As Janice was our Scrum Master, she facilitated discussions, recorded team progress since the last meeting, and noted tasks scheduled for completion before the next stand-up. She kept the team updated on each team member’s responsibilities, progress, and certain challenges or issues the project was facing.

Affinity Mapping

After each interview, we utilized FigJam for affinity mapping, which helped us identify patterns observed by the team. Each team member created sticky notes to organize session notes into categories like lifestyle, doctor experience/relation, and health. As a team, we then validated or invalidated our assumptions, guiding us in progressing with our prototype. In Design Week 1, we interviewed users to understand their needs and test assumptions. Team Janice used these interviews to refine our MVPs by asking questions related to personal aspects, gut health, social life, and awareness.

Paula DeCastro's Affinity Mapping

Paula DeCastro's Patterns

User Research Observations

After getting feedback and making changes to our app, we interviewed three more people to gather additional thoughts. We followed the same process as in week one, using affinity mapping. Team Janice identified significant patterns highlighted during the interviews, which helped us identify major setbacks and grasp a stronger understanding. Some users helped clarify confusing features, such as the favorite button, removing the "New Arrivals" section, and separating doctor consultations and past visits.

Retrospective Meeting

After our initial sprint, we held a retrospective meeting to review successes, team challenges, and identify areas for improvement in Sprint Two. This three-week sprint and retrospective deepened our understanding of the Lean UX Canvas and prompted a reassessment of our assumptions. Team Janice used these insights to advance to high-fidelity prototypes, focusing on enhancing the user interface and experience. Previously as a team, we didn't value and acknowledge the importance of a design system. We dove into what they were and the purpose they provide to a product.

Therefore, Design systems are organized sets of reusable design elements, patterns, and guidelines that guarantee consistency and efficiency in creating digital products. They consist of components, patterns, guidelines, and assets like color palettes and typography styles. After grasping this understanding, we managed to prioritize this to ensure visual and functional consistency, and uphold a unified brand identity. This phase marked the finalization of the product's design system, establishing a robust foundation for our design approach and brand identity.

Finalized Design System

Sprint 2

Revalidation

Revalidation played a crucial role in Sprint Two as it revisited the assumptions from the beginning of Sprint One. During this phase, we moved forward with our fresh insights, evaluating successes, failures, and areas for improvement. Team Janice completed the eight-step Lean UX method, selectively revising specific areas. We chose to remove the goal-setting feature and the product page due to low interest and biased comments. Simultaneously, we introduced three new features— a profile page, an effective onboarding process, and an articles section on gut health, aiming to enhance the user experience. Additionally, we updated our product problem statement based on the discovery that users are curious to learn more about the health of their stool.

New Proto-Personas

Concerning our Proto-Personas, Team Janice opted for a complete overhaul due to the mismatch with our observations. Aria and Kelly didn't align with our stated assumptions, leading us to create Alexis and Evan. These new Proto-Personas better emphasize the significance of their interest and awareness in gut health.

Updated Primary Proto-Persona

Updated Secondary Proto-Persona

User Research Observations

We created features from our Sprint Two backlog for interview sessions, following the same method as in Sprint One—interview sessions, stand-up meetings, affinity mapping, and continuous discussions. In this phase, we introduced usability testing with task-based scenarios for each feature, gaining insights into user feedback and design element importance. Post-interviews, we used FigJam to apply observations and conduct affinity mapping, identifying new categories beneficial to our product. Team Janice consistently discussed and designed our prototype, aiming to deliver a polished high-fidelity product.

Refinement

In the final week of Sprint Two, we focused on completing the prototype to achieve a polished high-fidelity application. We finalized the visual design to establish a robust and visually appealing foundation. Conducting three interviews with task-based scenarios provided valuable criticism and detailed feedback on our flow and prototype, incorporated into our final affinity mapping session. As Sprint Two came to a close, Team Janice refined and completed our high-fidelity app. Collaboratively, we identified crucial improvements that highlighted users' needs and goals. Additional features were introduced to enhance the overall user experience, proving successful in subsequent interview sessions and observations.

Conclusion

Takeaways

Good Shit was my second experience in Interaction Design but as a team designer. While our leader equipped us with her vision, resources, and guidance, the other team members and I focused on creating the necessary. It was an interesting opportunity to work with others and learn about their workflow, knowledge, and opinions. Our leader prioritized communication and honesty, which were a huge influence on our decision-making. Our team had a great connection with each other, which was a plus because it allowed us to be comfortable with our team members.

Lessons learned

Something that I wish that could’ve been different is having trust. Insufficient trust led to being part of the uncertainty in our decision-making. As we made changes, some of our members were concerned about not being able to meet deadlines in our timeline. This led to members being comfortable with the initial designs and not responding well to innovation from our findings.

As previously stated, not having enough time to further our insights led to unresolved questions and concerns. If we had a stronger trust connection, I think our team would’ve been more open, proactive to change and recognized the importance of sharing their concern, and creating or supporting a game plan. Our leader was very considerate and anticipated our team members' concerns by being accommodating and reasonable with our schedules and overall workflow. 

After all, if additional time had been given during this project, we would’ve focused on setting up more user interviews and usability testing to expand on our insights and questions we had. Furthermore, this would’ve helped us to support our design implementation and clearer identification of product problems.

Overall

Creating Good Shit was an exciting and spontaneously fun experience to create a gut tracker application that can actually be extremely valuable and functional for millions of users who are actually interested and would like to learn more about their digestion heath. If this was launched or introduced in the future, I would’ve personally used the application to become more conscious about my gut and be more proactive about my wellness. During this project, I learned the significance of exploring new ideas and design approaches without fear or limitations. It definitely challenged the team but I think it demonstrated to us how each team member responded to change. We accommodated each other and we were pleased with our final outcome! Thankfully, I can apply my knowledge and expertise in the design world!

Overview

Aura is an interactive digital kiosk where we primarily focus on providing users with a smooth and innovative shopping experience. Through Aura, it will integrate with retail companies to deliver enhanced customer satisfaction when it comes to shopping. Furthermore, users were able to pick up online orders and have an opportunity to perform a seasonal color analysis to discover their colors for fashion. Our primary goal was to create our digital kiosk to be innovative and engaging for all users.

Aura captures the individual preferences of its users and customizes its responses to match their distinctive styles. This tool proves valuable for individuals seeking to simplify their shopping process and optimize their fashion collection. The originality came from our Team Lead, Janice Kim, who has a passion for shopping and fashion, and sought to explore a method of how to teach users to grasp a better understanding of color analysis and overall shopping experience.

Role

UX Designer
UX Researcher

Timeline

February - April 2023

Approach

Goal-Directed Design

Tools

Canva
Discord
Figma/FigJam

Phase One

Problem Statement

Existing interactive kiosks prioritize contactless services, neglecting personalizations and recommendations, while several focus solely on sales engagements and transactions. Our kiosk will fill this void by offering an enjoyable, personalized, and efficient shopping experience, featuring seasonal color analysis, online order pickups, and item reservations.

Method

In this project, we used the Goal-Directed Design (GDD) process, a product design approach by Alan Cooper. It focuses on creating designs that meet user needs and goals while addressing business requirements. The following sections guide you through each GDD phase, from Research to Refinement, with documentation showcasing our design team's insights, challenges, and solutions. This project was part of the TCIAD4700 (Capstone Project and Portfolio Showcase) requirements at Kennesaw State University, supervised by Dr. Leslie Hankey

Phase Two

Research

The Research phase of Goal-Directed Design focuses on collecting qualitative data and pertinent information about the subject, domain, and potential users relevant to the product. This phase consists of four major steps: Kickoff Meeting, Literature Review, Competitive Audit, and User Observation/Interviews.

Kickoff Meeting

In Kickoff Meetings, stakeholders present the project idea to both design and development teams. Designers discuss users, competitors, and challenges, brainstorming to answer key questions. In our class project, Team Janice collaborated to form a problem statement and assumptions statements, guiding our process to simplify everything.

Literature Review

The Literature Review allows designers to delve into relevant literature about the product and its domain. This step is crucial as it forms the basis for well-informed interviews with stakeholders and subject matter experts (SMEs).

Team Janice conducted the Literature Review, uncovering valuable insights that we will share.
1. The popularity of retail kiosks increased post-pandemic as customers have adjusted to no employee interactions.
2. Retail Kiosks are convenient, easy, and quick for all users, enhancing their shopping experience.
3. A positive experience will resonate with the customer, and they will be more likely to use the kiosk again in the future.

Competitive Audit

During the Competitive Audit phase, the design team examines systems, interactions, and interfaces of existing products in the same domain. This provides insight into the strengths, limitations, trends, and design patterns of comparable products on the market.

Competitive Audit Glimpse

Phase Three

User Research Interviews

In Goal-Directed Design, we use ethnographic interviews to collect important qualitative data for a deeper understanding of users and their goals. This method blends engaging observation and guided interviews, aiming to grasp interviewees' contexts and comprehend their attitudes, beliefs, and values concerning the product's domain.

To achieve a complete and in-depth understanding of the development of Aura, we conducted five user interviews to collect patterns, answers, and different perspectives from individuals. As we conducted these interviews, we came to an understanding that some of our interviewees had similarities and differences in their shopping experience, retail, and in-store or online orders. Team Kim was able to acknowledge and differentiate our findings, that later shaped our user personas.

Affinity Mapping

Affinity mapping is a crucial technique in the field of design and problem-solving, providing a visual and collaborative way to organize and make sense of diverse ideas, information, and insights. By grouping related concepts, patterns, and observations, affinity mapping helps teams simplify complex data into clear, manageable topics. This process fosters shared understanding, promotes collaboration, and unveils potential solutions or directions. The visual representation facilitates more effective decision-making, enabling teams to prioritize and address key issues structurally. Ultimately, affinity mapping served as a powerful tool to streamline communication, enhance creativity, and drive the development of Aura.

Affinity Mapping 2/5

Phase Four

Modeling

During the modeling stage of the Goal-Directed Design, our team had to create primary and secondary personas that represent the user's point of view. Personas are not real, but fictitious users or models built through behaviors and goals that represent large groups of users. Personas provide a clear approach to understanding how different users behave and why. Personas are essential to goal-driven design because they are the people to consider when developing and focusing on user goals. Through research and behavioral patterns, our personas have allowed us to design for specific types of people that overcome some of the issues that derail product development. It's an effective way to communicate and analyze your designs so that your users can fully understand and enjoy them.

"Personas are successful as user models because they are anthropomorphic. Design and development empathize with user goals is built in (Cooper 66)."

Primary Persona

Secondary Persona

Phase Five

Requirements

The Requirements phase in GDD is a pivotal step in the design process. Here, designers transform their research and observations into solutions that meet user needs, navigating technical constraints and aligning with business goals.

For Context Scenarios, we employed narrative as a design tool to vividly depict a user's interaction with our product system. These scenarios take the form of a short narrative, portraying a day in the life of the Persona and outlining their actions and expectations with the product at a high level.

Phase Six

Frameworks

In the Design Framework phase of GDD, we establish the structure of our product's system interface by organizing interactive behaviors, visual language, and functionality. This journey commences with the Interaction Framework, crafting low-fidelity wireframes, and progresses to the Visual Design Framework, defining a distinct visual style and identity.

Moving onto wireframes, they act as digital design blueprints, determining element placement and user flow. Their simplicity allows easy adjustments based on feedback before finalizing the appearance. Serving as a universal language for project collaborators, wireframes prioritize functionality over aesthetics. These foundational tools played a crucial role in planning and refining digital designs for our project, Aura. Through wireframes, Team Janice was able to establish the structure and functionality.

Wireframe/IA Glimpse

Design Systems

Design systems are structured collections of reusable design elements, patterns, and guidelines that ensure consistency and efficiency in digital product development. They include components, patterns, guidelines, and assets like color palettes and typography styles.

The benefits of design systems include promoting visual and functional consistency, streamlining the design and development process for increased efficiency, fostering collaboration among teams, addressing accessibility concerns, and maintaining a cohesive brand identity. In essence, design systems serve as a structured framework that improves the overall user experience and contributes to the success of digital products and brand recognition.

As a team, we truly valued the importance of establishing a design system, to successfully deliver structured guidance that would not only help us as designers, but our users to increase Aura's visual recognition and overall user experience.

Aura Design System

Phase Seven

Refinement

The Refinement phase signifies the shift from low-fidelity wireframes to a high-fidelity, fully functional prototype. This stage involves enhancing form and behavior, resulting in high-resolution screens that vividly represent the user interface. Essentially, the Refinement phase in GDD is where the product comes to life both visually and interactively.

Dashboard Menu

Logout

Orders

View Order

Phase Eight

Takeaways

Aura was my Senior and Capstone project where students were responsible for their resources, software tools, and project management of this experience. We had three professors as mentors, but they simply instructed us with the requirements, methodology, and contact information for any future questions and concerns. It was a raw journey because we had to tackle this experience alone with what we knew already. My team members were equipped with intelligence, positive attitudes, active listeners, accountability, empathy, and awesome communication skills. We were ready to strive and excel together. After all, if additional time had been given during this project, we would’ve focused on setting up more user interviews and usability testing to expand on our insights and questions we had. Furthermore, this would’ve helped us to support our design implementation and clearer identification of product problems. Once again, our team had no issues in being proactive and open with their ideas. We had no internal conflicts and were consistent with their deadlines. They never failed to express their concerns towards any alerting situations, which was a highlight and strength in Team Janice. It was absolutely enjoyable and amusing to work with creative individuals who wanted to accomplish the same goal that everyone had in mind.

Being part of Aura was an exciting and spontaneously fun experience to create a Retail SAAS product that can be extremely valuable and functional for millions of users and retail companies. I strongly believe if this was launched or introduced in the future, it would bring a positive impact to the retail industry and shopping experience. During this project, I learned the significance of how influential information architecture is when it comes to structuring your content. Furthermore, it allows us to appropriately outline the navigation system and user flows to acquire an understanding of how to navigate and achieve user goals. Overall, Team Kim was extremely satisfied with our outcome and I’m thankful that I can apply my expertise in the future.

Overview

The hackathon was sponsored by 66Degrees, BeMyApp, and Google at the Google Atlanta office. The event was named Build with Google: Google Workspace and AppSheet.

66Degrees specializes in helping businesses across all industries modernize through cloud adoption to achieve data-driven transformation. As a pure-play Google Cloud partner, their team of experts leverages the latest Google Cloud technologies and best practices to create customized solutions for each client.

During this hackathon, teams gained feedback and guidance on their apps from 66degrees and Google experts. Companies and independent developers participated to learn and create a solution to compete for prizes. It was a dream come true to visit Google Atlanta and to create something impactful with talented people.

Role

UX Designer
Presenter

Timeline

October 23, 2023 - October 24, 2023

Place

1st Place
($5000 Cash Prize)

Tools

Figma
AppSheet
Google Slides

Meet the team

Elizabeth Anderson

UX & Product Designer

Learn more

Jenny Trejo

UX & Product Designer

Learn more

Jordy Mopewou

SOC Analyst @Nokia

Learn more

Ali Hashim

Project Manager @Delta

Learn more

Phase one

The kickstart

Identify the problem

"Organizations face difficulties in ensuring employees' adherence to mandatory vaccinations and health check-ups for international travel, resulting in possible project delays and collaboration disruptions. "

Our challenge was to build something that can be used by different types of healthcare organizations or businesses, therefore, we derived our focus into simplifying medical and healthcare requirements among our team when it comes to corporate international travel. We discussed about the hassle several individuals face when they're scheduled to fly to another country for business purposes. The list of medical requirements can be exhausting and time-consuming to understand and complete, leading to health risks and delayed project timelines.

Establish the solution

MedPass is a passport to seamless corporate international travel by simplifying medical requirements and status updates, ensuring employee safety and project timelines.

Our team's solution is an application called MedPass, which focuses on reducing administrative burdens and health-related risks, adhering to mandatory health protocols, and mitigating the risk of disruptions and project execution, by automating and organizing medical documentation through dynamic emails and status updates.

Target Audience

Our main audience was large corporations and their employees. We wanted to identify our users at once to understand the user flows. While we didn’t have enough time to create personas, we knew our audience was busy individuals, who sought a method to understand what medical requirements are necessary to complete without affecting their workload and team management.

We proceeded to focus on our information architecture to construct our navigation system and user flows.

Navigating user goals and pain points

Towards the end of this phase, our emphasis was on translating our research findings into a user-centric design solution. We derived our context scenario draft from identified goals and pain points, aligning user needs with potential solutions. It helped us ground our product in corporate business travel, prioritizing a seamless and safe space.

User Goals:
Prepare and notify employees about required vaccines and check-ups for international travel

Allow a seamless vaccination and check-in update for international travel


Pain Points:
Action items must be complete or it’ll prevent employees from traveling

Incomplete action items can lead to project delays and hinder team collaboration, causing a backlog of work

Phase two

Innovation unveiled

Mastering AppSheet

Part of the hackathon challenge was to learn and utilize AppSheet as the main software to create a functional prototype. AppSheet is a no-code platform that empowers users to create custom mobile and web applications. It uses a spreadsheet-like interface, making it accessible for users to define data, workflows, and application logic.

Due to splitting our team into pairs, Jordy and Ali's priority was to begin development. They spent endless hours learning the fundamentals of AppSheet through tutorials, mentorship, and hands-on experience. Thanks to 66 Degrees for demonstrating interesting approaches and answering our questions as we continued to develop.

feijfiejfe

Ideation

After identifying user goals and pain points to determine user outcomes, Elizabeth and I agreed that this would help us recognize areas for improvement and innovation, develop a clear UX strategy, and approve design decisions. It would also empower us to evaluate the project’s success and make adjustments as proceed forward.  In the hope of achieving user goals and to avoid obstacles that may invoke difficulty, we began our

Ready. Set. Deploy!

Once Jordy and Ali had an established understanding of AppSheet, they began to create our prototype. During this phase, we continued to ask questions to each other to clarify any gaps that would've hindered our problem and solution space, along with our deadline. Through automation, they were able to execute a dynamic email and connect data through the integration with Google Workspace. In the end, they were able to develop our codeless product as accurately as possible by following our user flows and establishing the navigation system.

The Visual Alchemy

After ideating, we continued as pairs to complete our checklist before time was up. Elizabeth and I constructed a document to record our thoughts and findings and then transitioned our finalized content into a well-rounded presentation. As a team, we agreed on including a logo to increase brand recognition and create a connection for initial trust. Therefore, I created a simple, yet effective logo for MedPass. Before moving forward, we successfully coordinated our timeline and direction of the project. Our team knew that user experience and brand recognition were fundamental components for success, and must be part of the presentation deck.

Phase three

Design Handover

Seal the deal

Once Elizabeth and I concluded our presentation deck, we checked in with Jordy and Ali about the prototype's progress. They ran several executions to ensure full functionality for our presentation and everything was successful. We quickly crafted some mock-ups and GIFs, to help visually communicate MedPass to the judge panel.

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Practice, prepare, and present

After revising and finalizing our mock-ups into our presentation deck, Elizabeth and I began to practice our presentation skills. We ran through several runs to find our strengths and weaknesses, and improve each other's performance. We both understood our priority was to finish before the 4-minute mark and reveal our idea to the judging panel. After practicing for 20 minutes, we wrapped it up and went back with our team to prepare ourselves for presentations

Overview

How to Logic Pro was created for the class, User Interface Design 2, at Kennesaw State University. My class was required to develop an informational website/app prototype designed to teach the users something new, utilizing 20 key terms such as concepts and principles of user interface design. Throughout my tutorial, I focus on teaching users how to change an audio tempo file and how to upload a new plug-in on Logic Pro in a smooth and understandable interface.

Phase four

Reflections

Results

Winning first place was such an amazing feeling we felt as a team. We were very proud of each other and how Team Black Cats managed to remain positive and trust the process. When I initially found out about this event, I was skeptical about it because I didn't know what to expect as a UX Designer. I wasn't sure if it was the right event for individuals in my field, but I still signed up to show up, establish connections, and simply have fun. I didn’t care about the prize, I simply wanted to gain an unforgettable experience and I’m glad I did. Because of our hard work and dedication, Black Cats was awarded first place and received the $5k prize. We were ecstatic with the outcome and we celebrated our success by having dinner together to celebrate, reflect on our work, and express our gratitude towards each other.

Learnings

Because this was my first hackathon, I was nervous but excited about the experience. I learned so much and was satisfied with the outcome and the people I met. Some major takeaways were:

Communicate and comprehend effectively
Working with two individuals who had never worked with UX previously on a cross-functional team forced Elizabeth and me to justify our choices and involve them thoroughly in our user-thinking process. Therefore, communication was key to our team because we had to ensure our each team member needed to understand our approach towards the project.  

Ask questions, get answers
It was important to ask questions when we had problems or concerns to move forward with our decision-making. Given our short timeframe, we used our resources and asked our mentors to decide on our design and development decisions.

Balance out the strengths and weaknesses
Acknowledging our team's strengths and weaknesses allowed us to work in pairs and tackle the project with what we knew best and the positive impact it would bring. Through this decision, we were comfortable with our responsibilities and trust each other with the process despite the challenges we still faced.

Organize and structure
We had a short timeline to create and submit our deliverables as a team. We took our time to construct a plan and to execute productively to receive the best outcome.

Ready to connect?

Up