Project 1:DICTION

A mobile application to help users learn new vocabularies by pracitcing using the words in a real conversation with A.I.

Diction Cover Graphic Diction graphic 1 Diction graphic 2 Diction graphic 4 Diction graphic 4

Design Process

  1. 1:Competitor Analysis
  2. 2:User Research
  3. 3:Persona
  4. 4:User Flow
  5. 5:Wireframing and Prototyping
  6. 6:Usability Testing

1 Competitive anlaysis

QUIZLET

Competitive anlaysis:Quizlet

pros

  1. Clean organization makes users easy to follow/use the app
  2. Simple survey introduction in order to connect the user with the other users who have taken the same study courses and already created a set of words to study. This maximizes the efficiency in studying and network among the school peers.
  3. Different users could collaborate in editing a set of words, fixing mistakes, and adding more information.
  4. Different tools, such as flashcards, quizzes, and games with other users, keep the users engaged and spend more time on the app.
  5. Personalized flashcards and network will make the user become more loyal to the application because the users wouldn't want to lose the data.

cons

  1. Too many tools all together on one page could confuse the users when the users are just starting to use the app.
  2. Users must create an account with an email in order to use the application. Some users who don't want to type in personal information could be distracted by this feature.
  3. On one page, the distinction between the word and the definition is clear but on the other pages, there is no clear distinction between the word and the definition on the flashcard which could confuse the users when studying the words.
  4. The transition is often lagging when the user tries to slide the flashcard to view the next flashcard because the app is confused whether the user is trying to flip the card or slide the card.

VOCABULARY

Competitive anlaysis:Vocabulary

pros

  1. Smooth animated transitions
  2. Quick, simple survey introduction to personalize the vocabulary
  3. Trendy fonts and illustrations that would grab attention from the young audience
  4. A lot of negative space emphasizes the word and its definition
  5. Vocabulary list can be categorized by different topics such as society, the human body, and medical.
  6. Vocabulary words in other languages are also available.

cons

  1. The free trial only lasts for 3 days
  2. Application doesn't contain enough tools to have users pay so much when there are other free vocab learning apps such as Quizlet.
  3. Lacks content variety. Other than the customizable visuals of the application, this application doesn't have any other tools to train users to memorize the vocab. The customizable background tool seems unnecessary.

2 User Research

User Interviews

3 Persona

Persona:Lily

Problem statement: Liliac needs to build a regular studying routine to improve her English and get better at understanding English in different accents because she struggles with understanding the students with strong accents and making casual conversations with people in English. We will know this to be true when she makes daily check-ins on the app every day and regularly takes vocabulary tests to validate her progress in her test scores.

Hypothesis statement: We believe that by creating a vocab learning app where the users conversate with A.I. that could talk back in an accent of user's choice so that the users could become more familiarized with different accents and improve their listening skills, we will achieve having Lilac getting more confident and better at making casual conversations with other people in English.

4 User Flow

Task Analysis: Create a new collection of vocabulary flashcards

Entry Point: Home Screen

Success Criteria: Create a collection of vocabulary flashcards to study

  1. Log in
  2. Select the 'Add' icon in the navigation bar
  3. Create a new collection
  4. Name the collection
  5. Write the description of the collection
  6. Add a new flashcard to the collection
  7. Search a word
  8. Select the definition
  9. Add an image to the flashcard if desired
  10. Select 'Done' to save the flashcard
  11. Create as many vocabulary flashcards as desired
  12. Select 'Save the collection' to save the collection
User Flow:Lily

5 Wireframes

Low-fidelity wireframes

Lo-fi Wireframes

High-fidelity Wireframes

Hi-fi Wireframes

7 Usability Testings

Usability Test Report

Usability Test Report

Revisions Needed

  1. Insert LOG IN logos (Facebook / Google / Apple)
  2. Separate word reminder notification (notification allowance)
  3. Make the 'SAVE' button darker
  4. Make the stacks in the library two rows instead of three rows
  5. Potential ads placement
  6. Get rid of the (library/profile/setting)sub-menu error
  7. Remove the Glob icon during the 'creating a new flashcard' process
  8. Make the word reminder setting easier to find

What I would do differently next time

  • Trust in the design process: don't stick to one idea at the beginning of the project.
  • Move forward and seek advice from others fast: finishing on time is also a professional skill.No perfect design: I will never reach perfection but there's always a space to get better.
  • A good foundation: listen to the data conducted from the research carefully Empathy: Empathize with the audience rather than merely studying them.
  • Prepare for the several rounds of user testing for new ideas
  • Practice the technical skills for clear delivery and message
Thank You
Project Snapshot: Bloodwork Monitoring Application >