zanninso
d838207849
|
3 months ago | |
|---|---|---|
| .. | ||
| audit | 3 months ago | |
| README.md | 3 months ago | |
README.md
Heuristics
Context:
A music label specialized in music from South America asks you to improve the user experience. This quest is about heuristics and content organization!
Instructions
Conduct a heuristic analysis on one of these websites:
-
You can choose another one, as long as it is a South American music label.
-
Upload the document on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
-
Add a title within the document.
Deliverables
- A duplicated and completed checklist on a sheet document (Google Sheets, Airtable, Excel, etc.).
- Tool : Heuristic evaluation checklist
Tips:
- Pay attention to the global aspect of the documents. It must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Resources:
- 3 ways good design makes you happy - TED talk by Don Norman
- Introduction to heuristic evaluation: a beginner’s guide
- Nielsen's 10 usability heuristics
- What you really get from a heuristic evaluation
- Heuristic analysis for UX: How to run a usability evaluation
- Heuristic analysis in the design process
- A new usability heuristic evaluation checklist
Quote:
'If you think design is expensive, you should look at the cost of bad design’ Ralf Speth | Former CEO Jaguar Land Rover
Site map
Instructions
Stick to the website you have chosen in the previous exercise "heuristics" and design a site map. The site map should include all the pages of the website as well as the connections and hierarchy.
List of websites:
- Universal Music Latin America
- Delta Records
- Zoho Music
- Luaka Bop
- Rimas Music
- You can choose another one, as long as it is a South American music label.
- Upload the PDF document on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the document.
Deliverables
- A PDF page of the site map.
Tips:
- Start by drawing on paper, then pass it on to a digital tool.
- Please label your document! Title and name of the website.
- Pay attention to the global aspect of the document. It must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Resources:
Recommended tools:
- Figma
- Adobe Illustrator
Quote:
"The organization, search, and navigation systems that help people to complete tasks, find what they need, and understand what they’ve found’ Peter Morville | Information Architecture for the WWW.
JTBD
Instructions
Let's practice Jobs-to-be-done to be more specific about how a music label website could be improved.
Read about Jobs-to-be-Done and the psychologic dimension behind this tool.
Then, find someone (your "user") around you who likes music a lot.
Ask them about what they would do on a music label website. Ask them why, why and why to understand the emotion behind an action, and the purpose behind a simple visit on a website.
Complete the JTBD template below including the true purpose of your "user".
And remember: You are not your user!
- Upload the PDF document on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the document.
Deliverable:
- A complete Jobs-to-Be-Done on a PDF document.
- Complete this sentence and include it on the document "When __, I want to _ So I can _"
Tips:
- Pay attention to the global aspect of the document. It must be clear, simple and easy to read. You can get inspiration canva but don"t overload your design with too much details!
Resources:
Quote:
- "When we identify user stories early in the design process, we let them dictate the design decisions. Rather than let our preconceived ideas of how the product should be or should look do it." UX Booth
- "Documenting the what and why of each element promotes organization and makes the handoff to the development team much smoother." UX Booth
- "When we buy a product, we essentially "hire" something to get a job done. If it does the job well, when we are confronted with the same job, we hire that same product again. And if the product does a crummy job, we "fire" it and look around for something else we might hire to solve the problem." Clayton M Christensen
Card sorting
Instructions
In the present situation, the websites are not ideal to complete the Jobs-to-be-Done your user has in mind. So let's practice card sorting to rearrange the content of the website!
Organize a card sorting workshop with the content of the website you chose in the exercise "Heuristics".
To do so:
- Define your research goals.
- Prepare the material.
- Find participants.
- Run a card sorting workshop on 5 people.
- Suggest a new taxonomy (content organization).
Don't forget to:
- Upload the documents on Github, in a zip folder named “ProjectTitle_Name_FirstName”, with all project deliverables as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, the first deliverable can be named as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within all written documents.
List of websites:
- Universal Music Latin America
- Delta Records
- Zoho Music
- Luaka Bop
- Rimas Music
- You can choose another one, as long as it is a South American music label.
Deliverables
- A card sorting workshop script with the research goals (PDF document).
- Pictures of the ongoing workshop.
- A document to show the new content organization (it can be a picture of the board with sticky notes or the digital version).
Tips:
- Pay attention to the global aspect of the deliverables. They must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Resources:
- Basics on how to conduct card sorting
- Card Sorting — what, how & the perks
- 10 things to know about card sorting
- Card sorting: a definitive guide
Music label wireframes
Instructions
Pick a product (a record, a song or an album) from your music label website.
Based on the new taxonomy (content categorization), show the different paths a user has to take to reach the product with a series of wireframes.
List of websites:
- Universal Music Latin America
- Delta Records
- Zoho Music
- Luaka Bop
- Rimas Music
- You can choose another one, as long as it is a South American music label.
Don't forget to:
- Upload the Figma file on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the file.
Deliverables
- Wireframes (6 to 12 screens) from the home page to the product page, on Figma.
Tips:
- Drawing a user journey first might be helpful before rushing into wireframes
- Drawing paper prototypes before going digital might save you some time.
- Several paths are encouraged
- Pay attention to the global aspect of the file. It must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Vocabulary:
- Low-Fidelity: Paper Prototypes - Example here
- Mid-Fidelity: Wireframes - black and white, only the main elements, on digital prototype tools - Example here
- High-Fidelity: Wireframes with color, styles, graphical details, and micro-interactions - Example here
Resources:
- How to start sketching and wireframing
- Why should product teams use wireframes more often?
- The 5-pass reduction wireframing: A minimalist UX technique
- The art of designing good wireframes
Recommended tools:
- Figma.
Test protocol
Instructions
Prepare a protocol for usability testing.
Recommended steps:
- Define the scope of the test.
- Recruit 5 users.
- Identify objectives: What are you proving?
- Establish metrics: How are you proving your design is efficient?
- Describe the steps and the instructions.
- Write an introduction to greet their user.
- Write a conclusion to thank the user.
Don't forget to:
- Upload the PDF document on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the document.
Deliverable:
- A PDF document with a test protocol.
Tips:
- Pay attention to the global aspect of the document. It must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Resources
- How to do a user interview (tutorial from Google Ventures)
- Running a usability test
- Usability testing: what is it and how to do it?
Quote:
- You need to detect: How many errors do users make? How severe are these errors? How easily can they recover from the errors?
Run 5 tests
Instructions
Run the test on 5 people!
Don't forget to:
- Upload the documents on Github, in a zip folder named “ProjectTitle_Name_FirstName”, with all project deliverables as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, the first deliverable can be named as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within all written documents.
Deliverables
- Pictures of the ongoing test.
- A PDF document with the conclusions from each test and 3 major ideas to improve the prototype.
Tips:
- Pay attention to the global aspect of the deliverables. They must be clear, simple and easy to read. You can get inspiration canva but don’t overload your design with too much details!
Resources:
- Running a usability test
- How to do a user interview (tutorial from Google Ventures)
- Analyzing usability testing data
- The art of guerrilla usability testing
- How to write a user testing report that people will actually read
Quote:
- To get trustworthy results in your test, you can’t ask your customers to use their imagination. You’ve got to show them something realistic. If you do, their reactions will be genuine.