Major Project 1

19/02/2025

ALTAIFI, LEEN MAAN A (0367698)

Bachelor of Design (Hons) in Creative Media, Taylor's University

Major Project 1


Table of Content

1. Tasks

        1.1 Task 1

        1.2 Task 2

        1.3 Task 3 

2. Feedback

3. Reflections


1.1 Task 1

Week 1: Brainstorming and Developing Project Plan

In our first week of this semester, we were consulted about our major project module, its guidelines, and what we're expected to do. We were assigned lecturers as our advisors to consult with throughout this semester. Our assigned advisor was Mr. Shamsul. 

In our tutorial class, we were brainstorming different environmental, social, and political, and even everyday problems that we can tackle for our project. We used Miro to demonstrate all our different ideas. My group and I eventually narrowed down a few selections from our brainstorming session and ended up with 3 options: Animal adoption, tackling fast fashion, and mental wellbeing. After discussing further, we all collectively agreed on tackling the animal shelter issues due to it being one of the more urgent problems that can be tackled directly via our pet adoption app solution, which will be more elaborated on in the project development plan.


Project Development Planning:

After choosing our main problem to tackle, we laid down our aims, objectives, and target audiences for this project. 

Since we decided on creating an app as a solution for encouraging people to adopt rather than shop, we needed to think of a name for the pet adoption app. After our discussion we were left with 3 options: 

Tailo, Fetchr, and Sniffy.

Since we couldn't decide ourselves on the name as our answers varied, we thought it would be best to ask our potential users and include this question in the target demographic interviews.


Week 2: Preparing Interview Questions & Conducting User Research

My group and I sat down and worked on the interview questions together. We separated the interview into 5 sections: Demographic, General App Preferences, and the 3 target demographic groups: Pet owners, animal shelter workers/ fosterers, and potential adopters. We thought it would be best to include a variation of questions depending on the demographic group because each group has a different insight and perspective that can be beneficial to our research.

Each member of this team has to interview 3 targeted users, so I had to scout for one of each of our demographic groups. I used purposeful sampling and selected participants that I know suited and matched our target demographic groups.

My first targeted user is Tala, an employed 24 year old IT Worker, who is keen on adopting a pet. I've conducted the interview online via google meet.


Fig.1.0: Interview with Potential Adopter - Tala

Tala interview drive link


My second targeted user is Huzefa, a 20 year old unemployed student, who has owned 2 dogs for 15 years.


Fig.1.1: Interview with Pet Owner - Huzefa

Huzefa interview drive link


Laslty, my third targeted user is Iman, a 23 year old student, who has had experience working at an animal shelter.


Fig.1.2:  Interview with Animal Shelter Volunteer - Iman

Iman Interview drive link


Week 3: Synthesizing User Data and User Insights Patterns

After conducting all the interviews, I compile all the footage and recordings of the interviews and transcribe the audio in order for me to synthesize the data. I used Microsoft Clipchamp video editor to edit and transcribe the audio, then transferred the text into a google doc to refine the transcription.

Fig.1.3: Editing interviews on Microsoft Clipchamp

As you can see on the right side, the software auto-generates captions for the video audio, which is what i used for the transcription. I edited and refined it in google docs after generating the captions for each interview.

Fig.1.4: Potential Adopter - Transcription


Fig.1.5: Pet Owner - Transcription


Fig.1.6: Animal Shelter Volunteer - Transcription



From my 3 interviews, I try to find key data patterns that could be helpful in categorizing the raw data into the affinity diagram. We continue working on the Miro board to structure our interview data.

By having these categories, I put them on the affinity diagram so that the rest of my team members add their data as well so we can collectively synthesize all our interviews and emerge patterns.

Fig.1.7: Task 1 Affinity Diagram on Miro


Miro Board link


1.2 Task 2

Week 4: Creating User Personas Based on User Insights

For task 2, we were instructed to create user personas and a respective user journey map. Because we are a group of 4, each of us constructed 1 user persona with its user journey map, making it a total of 4 user personas and journey maps. We divided the demographic groups as follows: 

1. Experienced pet owner ( a parent with family): Cindy

2. Potential adopter (single young adult): Gabriela

3. Animal shelter worker (any age range but has devotion to animal rights): Areeya

4. Retired senior citizen that wants to adopt a pet for some company: Leen

We interviewed 3 user demographic groups: pet owners, potential adopters, and animal shelter workers/volunteers, therefore we wanted to represent these 3 groups in our personas. And since, ideally, we want our app to target as many groups of people as possible, we also separated the user personas based on age groups as well, to make it accessible for all. 

The user persona i was working on represented the senior citizen age group that are in need of a pet for company after all their children have grown up and left their homes.

We referenced existing user persona to help organize our own work and information. In the personas, we included personal demographic information, personality, general description, goals, motivations, frustrations, technical abilities with devices and internet usage, and interests & hobbies. 

Fig.1.8: User Persona Reference 1

Fig.1.9: User Persona Reference 2









I've constructed the persona of Rachel Lim, who is a retired school teacher that wants to bring companionship and joy into her home, find a trusted adoption platform that simplifies the adoption process, adopt a pet that matches her calm and slower-paced lifestyle, and access support and guidance for pet care.

Fig.1.10:
User Rachel Lim Persona



Week 5: Building User Experience Journey Maps

Then, I ensured to create a detailed user experience journey map encapsulating the process of becoming aware of the app, to the end of the app journey which consists of the post-adoption services. The main purpose of the app is to encourage people to adopt pets, however, we wish to keep users engaged on the app, hence we added community forums, guides, and additional services, to ease the process of transitioning to a pet owner.


Fig.1.11: User Rachel Lim Needs, Frustrations, and Areas of Focus.



I noted down Rachel's needs, frustrations, and areas of focus as notes right beside the journey map in the miro board to ensure all my steps align with the user persona's needs and focus, making the journey map precise and goal-oriented.

Fig.1.12: User Rachel Lim User Experience Journey Map
 Process



It's important to note down the user's goal, actions, positive emotion, negative emotion, solutions, and touch points of every step of the user's journey to make the process as realistic and detailed as possible.

Fig.1.13: User Rachel Lim User Experience Journey Map


1.3 Task 3

Week 6: Developing Information Architecture and Brainstorming Ideations

In the third and final task, we are required to brainstorm ideations using storyboarding, sketches etc., design inspiration from other design resources/websites for ideations, develop Information Architecture (using Card Sorting Method) for your proposed solution, develop User Flow/Work Flow diagram, design Design Guideline (color scheme, typography, UI component...etc.) that is related to the project topic and targeted user personas, and create the initial Lo-fi prototype.

My groupmates and I conducted a meeting and worked together on brainstorming ideas for our design guidelines, and work on the information architecture of the app, that of which includes card sorting and user flow-diagram. 

First, we jutted down all the features that we plan to have in our app, and created some categories for it. However, this was very biased due to the reason that we categorized the features ourselves from our own understanding. 

Fig.1.14: 'Fetchr' Card sorting on Miro - First Attempt


After our consultation session with our advisor Mr. Shamsul, we pointed out that the category 'places' was very vague, and users wouldn't understand what it's for. Therefore, I reorganized the cards and added a few new features that will be beneficial to use in our user flow diagram later on, and for the card testing that we will be conducting.

Fig.1.15: 'Fetchr' Card sorting on Miro - Updated

After laying down all the cards/features, I exported them onto UXTweak to conduct the user testing. We have chosen the unsupervised method and closed card sorting type, so that users only put the features where they see fit in the given categories.

Fig.1.17: Card Sorting Test on UXTweak
-Categories

Fig.1.16: Card Sorting Test on UXTweak -Cards







We have recruited 10 users to conduct the card sorting study, and have used this data to enhance our app's information architecture. Below, is the summary of the card sorting study including the user's data and the matrix results.

Fig.1.19: Card Sorting Test Result Matrix

Fig.1.18: Card Sorting Test User Analysis








From the data, there is general consensus on most of the features, which makes this study efficient for us to base our design off of. With the exceptions of some features, however, that had a distributed even number of options. Such as Book vet appointment, Pet healthcare tracker, and Animal Shelters near me. Below, is the final categorization of our app's features.

Fig.1.20: Card Sorting Test Study Results

Simultaneously, we also worked together on the user flow diagram, using the card sorting and user journey maps as reference to how the diagram flows. After our first attempt and showing Mr. Shamsul, he noted that our flows are too simple and require more detailed and in-depth steps. So, we needed to rework on that.

Fig.1.21: First Attempt of Flow Chart for 'Fetchr' App

Design Guideline

My groupmate, Cindy, and I have sketched out many doodles to just get all our ideas laid out for the app logo. We initially wanted to do a play on the letter 'F' and a dog, and somehow involve the meaning of 'fetch' in the logo, hence all the sketches.

Fig.1.22: Logo Ideation Sketches

After brainstorming ideas, we filtered out the ideas with potential and took it to illustrator. 

Fig.1.23: Logo Ideation on Illustrator

Eventually, we went the idea of flipping the 'r' in 'fetchr' which makes it look like a dog snout by using the Sono ExtraBold Font. To emphasize the dog shape, we added eyes and ears, thus creating our logo.

Fig.1.24: 'Fetchr' Logo Transition


We chose the 2 fonts: Inter and Sono for our brand identity. The combination of Inter for body text and Sono for headings were chosen to create a modern, user-friendly, and approachable experience.

Fig.1.25: Design Guideline -Fonts


We chose the combination of purple and yellow to create a visually appealing and emotionally engaging experience for users. Purple symbolizes trust, compassion, and creativity, while yellow represents warmth, happiness, and positivity. Together, these colors create a balanced contrast ensuring a user-friendly and an uplifting experience.

Fig.1.26: Design Guideline -Color Scheme


After choosing our brand colors, I have made multiple variations for our logo using our color scheme.

Fig.1.27: Design Guideline -Logo


Using existing UI kits online, it aided me to speed up the process of prototyping, which are what I used for iconography. The UI Components, however,  I made using figma, since they are pretty simple. 

Fig.1.28: Design Guideline -Iconography & UI Components


We chose a common grid system to have a consistent UI, and a basis for our layout. We chose the IPhone 16 Pro for our screen frame with 4 columns of 22px margins and 20px gutter for the grid system.

Fig.1.29: Design Guideline -Grid Systems


Week 7: Creating Wireframes & Lo-Fi Prototypes

I've sketched out some wireframes of the onboarding screens, home page, application process, and messaging before prototyping to get my ideas down quickly.

Fig.1.31: Wireframe Sketches
- Home Page
Fig.1.30: Wireframe Sketches
- Onboarding











After getting the sketches done, I started working on figma on the Home page Flow. Initially, our advisor told us we only had to do one lo-fi prototype and separate the flows amongst each other. Thus, we divided the flows, and i was in charge of the home page.


Fig.1.33: Lo-Fi Prototype Process on Figma 2

Fig.1.32: Lo-Fi Prototype Process on Figma 1



However, we suddenly get notified that we needed to do one whole lo-fi prototype individually, we were confused because our advisor was saying one thing, and the head of the module was saying another. We did not know what we were expected to do exactly, but I ended up doing as many screens as I can to play it safe.

I designed the onboarding, homepage, and messaging screens in depth, however, the community, profile, and notifications pretty simply.


Fig.1.35: Lo-Fi Prototype Process on Figma 4

Fig.1.34: Lo-Fi Prototype Process on Figma 3



After designing all the screens, I added the prototype interactivity to mimic how the final prototype would play out. Below, is my prototype link.

Fig.1.36: Lo-Fi Prototype Process on Figma 5

Prototype Link




Final Major Project 1 Presentation 'Fetchr'


Group 9_Fetchr_MP Final Presentation by ALTAIFI, LEEN MAAN A




2. Feedback

Week 2:
Mr. Shamsul reminded us to ask important questions regarding our designs that will help maximizing the user experience, such as, if they would be interested in paying for subscription service for pet expenses. And, don't forget to ask follow up questions, your questions should make sense and be in sequence so interviewees can answer well.

Week 3:
Make sure to categorize the data in the affinity diagram well and in a useful manner, summarizing the key findings from the interviews.

Week 4-5:
All okay, can continue with Task 3.

Week 6:
Mr. Shamsul said our flow chart had too little steps, so we need to add more depth to the flows. And some of the categories we had in the card sorting were very vague, such as 'places' so we needed to think of another name for it, and create a card sorting study with recruiting users to test with, at least 1 user each group member.

I also consulted with Mr. Shamsul about our logo, and he said it looked too complex for a logo, that we were forcing the shape of the dog on the word 'fetchr' that it just looked odd. Thus, he advised us to make a simpler logo.

Week 7:
When given feedback on our presentation, they told us to expand on the monetization, to think how the app will be able to survive on profit, and emphasize on the match making people to pets part for USP.

In my Lo-Fi prototype, sir suggested I change the 'welcome to Fetchr' all into the same font. And in the onboarding questionnaire, where it asks: "Choose your preferred pet", he advised me to rearrange it to cat, dog, and change rabbit to 'other'.



3. Reflections


Working on this project with my groupmates so far has been very insightful. Luckily, all of us are good at compromising so none of our ideas clashed, we discussed and built upon each other's inputs. We ended up choosing a topic all of us are interested in, the well-being of animals in shelters. Most of us have pets (all of our group except me), so we should have quite the say on what pet needs are and what pet owner would need...etc. However, we still needed data from interviews, of course.

It has been a very different experience I'd say, relative to other subjects throughout this course, since in these entire 7 weeks we were working on one project as a group. Admittedly, I did feel a bit lost and confused at times, but then i would remember what i had previously taken and apply what i've learned beforehand in this project. By applying the design thinking process and the process of user-centered design, i feel like it's becoming more and more intrinsic for me to follow, which is good practice that will help prepare me for the industry, hopefully.

However, I do have to point out that the last week of this semester in preparation of the final semester was really stressful. There were a lot of confusion on what the final task 3 expectation is, because our advisor was telling us one thing, and the head of major project was telling us another. There seems to be an internal disagreement that should've been resolved from the start of this module, which caused a ruckus for all students and especially my group. Despite the limited time span, we did what we could do, and i'm glad that my groupmates were punctual and had good work ethic.




Comments

Popular Posts