At a minimum, here’s what I recommend including in your UX case study:
- Overview / Introduction
- Problem statement
- Your UX Process
- Your Research
- Users and Audience
- Persona
- Task Analysis Or Task Scenarios
- Journey Map
- Pain Points
- Opportunities
- Competition (functionality – at least mention them/screen capture)
- Your Design Ideation
- Sketches/wireframes
- Mockups/Testing
- Outcomes and Lessons Learned
In more detail, this is what I would like you to concentrate on:
Overview/Introduction:
Write something about why you are connected to this website/app. That you are in a UX Strategy class at BCIT. That you are interested in UX AND this website/app, and want to use this process to see if you can fix the issues people (ideal users) may have with this website/app.
Problem statement:
What problems are you wanting to solve? It could be aesthetics/design issues… but that’s too easy. What about a change in the purchase process? Registration? Maybe a function doesn’t exist and you would like to add it?
Your UX Process:
It could be:
Research >> Design >> TEST >> Iterate! or…
Empathize >> Define >> Ideate >> Prototype >> Test! or…
Research and Discover >> Ideation and Design >> Prototype >> Test and Iterate!
Use this as the structure of your article!
Research:
You have already created a Persona, Scenario and a Journey Map. Incorporate these into your article. However! DO NOT SIMPLY ADD GRAPHICS TO YOUR ARTICLE WITHOUT EXPLAINING THEIR PURPOSE! In other words, please write a blurb about why you created a persona, journey map, and scenario (and any other exercise/process you do). What came out of doing this? Are you completing these exercises with a purpose in mind? Or… are you mindlessly adding junk to an article for no reason??
Again, add a description of each process. Why you did that process. And what was the result!
Add a Task Analysis and/or some Task Scenarios to your article. Focus ONLY on the Analysis/Scenarios that you intend to fix!
Note that you looked at competitors. For inspiration? To review functionality? Take some screen captures of what you found. Write your analysis.
Ideation:
Time to sketch out YOUR version of the interface. Start with simple sketches and then gravitate to more higher fidelity.
Use Wireframe Kits and Design Kits to jumpstart this process.
There are MANY UI Kits that you could use. Find one that matches your project’s website. Cupcakes?, Fences?, Kitchens?, etc. There may not be an exact match. So choose something that makes sense and swap out the graphics and use the resources (icons, photos, fonts, etc.) from the class notes. Unsplash.com, and Pexels.com are great resources for photos!
Here are some resources for UI Kits:
Invision (XD/Photoshop/Sketch) UI Kits – https://support.invisionapp.com/hc/en-us/articles/115000536363-Free-UI-design-kits
Adobe XD UI Kits – https://uxplanet.org/most-essential-adobe-xd-ui-kits-780be6f1d3d
Figma (use the “Community” section – search for UI Kit)
Envato Market https://themeforest.net/search/ui%20kit
Eventually test your Mockups using Invision (import the JPGs/PNGs and link them, and share the public link – Peer Testing). Take screen captures of the feedback you receive.
Outcome:
Finish your article with BEFORE and AFTER screen shots. Explain the differences.
Add your commentary on going through this process. Did it work? Was it worth it? What did you learn? What techniques were interesting? Did you resonate with any UX Laws/Interaction Principles?
*** NOTE ***
It is IMPORTANT that you write the “Case Study” as an “article”. Similar to: https://uxdesign.cc/apple-news-a-usability-case-study-1ae7b037a7fd
The flow is critical. If you have diagrams/images that are not introduced in the text/body of the article, YOU WILL LOSE MARKS! This assignment is about the UX process… not just the design of the interface.
Toronto Cupcakes Redesign- UX UI Case Study
This case study may contain copyrighted material the use of which has not been specifically authorized by the copyright owner.
This case study has helped me to promote my capabilities and advance my education specifically in the area relating to user experience (UX) research and includes my personal opinions, satire, criticism, and review. I believe this constitutes a ‘fair use/dealing’ of any such copyrighted material
The Brief
I came across to Toronto cupcake website couple of years ago when I visit the Toronto City. I really enjoy their cakes and desserts. I found that they have the great selection to choose from. They make the cakes and cupcake for all the special occasion. They offer the pre order for cupcakes and home delivery as well.
I found that it is great shop from quality perspective but when it’s come to user experience it has so much room for improvement. I am working to improve the user experience of this website as my university case study. The home is needs improvement for the easier use for customers.
The Challenge
The website has not changed much according to the latest technology. The home page of website is not organized very well. There is no option for customers to add things into their favourite list. In addition to this, footer is not very good as there is no contact showing to contact the bakery and not even showing the social media follow page. Users can not view cupcake into the video mode. The website does not the show the ingredients on when we select on the cupcake but I feel as people are more concern about the ingredients so it should be showing when we select the cupcakes.
The bottom of the website has so much blank page which does not give website a professional look. The font and color of the website is not very attractive. It does not show customers the best seller cupcakes because I feel if it shows first user the best seller items it will give them idea about what people are liking.
Process
To overcome the problems, I choose to use the following UX Process-
Empathize- Define- Ideate- Prototype- Test
Goal
The goal is to improve the look of the website and add more functions for easy accessibility for the user and make their experience easy and pleasant.
Empathize
I tried to understand about the target audience and what needs are and what are they looking specifically in the website. First, I start exploring the website and shows that it has lack of functionality.
The top navigation bar- The navigation bar does not show the sign in option, add to cart logo, favourites, or star items. It only has the Ham burger menu to navigate.
The Bottom nav- The bottom shows the options for the contact us, resource, about, etc. But it is not fully developed and professional as compared to other competitor websites. The picture below shows that-
Overall Analysis of the Website- The website does not design fully. It is unorganized and some of the options should have the icons as well to see more clear.
Define-
After understanding the website itself and the things that needs to work on. I start the next step of exploring the users and the things that they are performing on the website most.
Persona- It is general overview of the Toronto Cupcake users. It represents the whole target audience of the Toronto Cupcake website and help us to understand the needs and expectation about the Toronto Cupcake.
Customer Journey Map- The journey map shows the emotions and interaction between the users and system. It shows the overall experience user face when the use the website. It show the problem they face while using the website.
