APPLICATION DESIGN I: PROJECT 1
APPLICATION DESIGN I: PROJECT 1
29.8.2022 - 2.12.2022 (Week 1 - Week 14)
Er Xin Ru (Melanie) | 0354939
Bachelor Of Design (Hons) In Creative Media | Taylor's University
Subject: DST60504 - Application Design I
LECTURES
1. Application Design I - Lecture 1 (Week 2 | Lecture Slide) 5.9.2022
UI vs UX
What are the difference?
UX Designer
UX would say that that button should physically press down when you click it.
• UX Designers focus on the structure and layout of content, navigation and how users interact with them.
• The types of deliverables they produce include site- maps, user flows, prototypes and wireframes, which are more focussed on the underlying structure and purpose of the software.
• The visual appearance does impact on these, but can be created as a separate layer that is applied
over the top.
UI Designer
The UI would be a series of buttons and how they look
• Focus on the way the functionality is displayed and the fine detail of how users interact with the
interface.
• They produce the visual comps and functioning front-end code.
• This is very much about polished final production quality outputs.
Fig 1- User Experience Design
Designing for the USER
- Successful user interface design improves product. In fact, in some ways the UI is the product, according to Jakob Nielsen, User Advocate and Principal of the Nielsen Norman Group
- “If people can’t use a product, it might as well not exist,”
- This concept is especially true in a world where every marketplace-from books to electronics-is highly competitive
Common Characteristics
• There are a couple of standards that identify effective design across the board (regardless of
media or discipline)
• First consideration is determining who the user is
• The design must be as broad or narrow as necessary to accommodate the intended user
Common Characteristics
• There is no recipe that’s going to make your design appropriate for all applications and users
• “There’s no such thing as good design,”- Nielsen
• What to do?
Common Characteristics
• Listen to your users and observe them interacting with your design
• Think ahead of who will actually be using your product and go from there
• Graphic designers have been reared on a variety of formulaic methods and approaches for
successful design.
Common Characteristics
• It helps to think of any designed piece as an interface, be it a book, shampoo bottle, retail store, or Web site
• In order to make a connection with the user, the design’s interface must achieve its mission communicating information through the printed word, dispensing a product, projecting and
image or creating a space that’s easy to navigate
Common Characteristics
• Changing the focus from the designer’s aesthetic to the user’s need allows the product to be designed in a way that helps the user succeed
• From here, the aesthetic considerations can follow
Golden Rules of Interface Design
Interface expert Nielsen identifies five usability attributes designers should heed when creating a design interface, no matter what their medium:
• Ease of Learning
• Efficiency of Use
• Memorability
• Minimize Errors
• Satisfy the User
Do’s and Don’ts of UI
Design - Strong Logo Position
Strong Logo Position
Fig 2 - Strong Logo Position
Provide Hierarchy
Fig 2 - Strong Logo Position
Don’t use placeholder as labels
Fig 3 - Don’t use placeholder as labels
Primary CTA button should always stand out
Fig 4 - Primary CTA button should always stand out
Format the text properly
Fig 5 - Format the text properly
Don’t use radio button, instead use card - Use card instead of Radio button
Fig 6 - Use card instead of Radio button
Provide sample and use simple email address text field
Fig 7 - Provide sample and use simple email address text field
Use Color Psychology
Fig 8 - Use Color Psychology
Horizontal Alignment
Fig 8 - Horizontal Alignment
Keep fields minimal
Fig 9 - Keep fields minimal
Properly place your CTA button
Fig 10 - Properly place your CTA button
Defining Project Goal
Project Goals
• What do you want to achieve
• What is your desirable outcome
Defining Project Goal
Why?
• What needs to be solved?
• Input real user data
Defining Project Goal
Where?
• Type of OS (Ios, android, desktop etc)
• Input real user data
Defining Project Goal
When?
• Draft your timeline
Defining Project Goal
Who?
• Who are experiencing the pain points
Defining Project Goal
Success Metrics
• State your Key Performance Index (KPI)
2. Application Design I - Lecture 2 (Week 3 | Lecture Slide) 13.9.2022
Introduction To User Experience Research
Apps Project Flow
Apps Project Flow
Introduction To User -
Experience Research
“User research is how you will know your product or service will work in the real world, with real people. It’s where you will uncover or validate the user needs which should form the basis of what
you are designing”
• According to Design Modo, UX research is “the process of understanding user behaviors, needs, and
attitudes using different observation and feedback collection methods.”
• One of the other benefits of user experience research is that it helps us understand how people live their lives so we can respond to their needs with informed design solutions.
• Good UX research involves using the right method at the right time during the development of a product.
UX research as:
“The means through which you try to understand your users’ needs, behaviors and motivations and
validate your assumptions and solutions.”
User Experience Research: The Amateur V. The Professional
• Amateur UX designer-excluding end users from the design process.
• Replacing the act of speaking with users—never a good idea.
• Professional approach-to start the design process by listening to the end user.
• Overall, UX research helps us avoid our biases since we are required to design solutions for people who are not like us.
Experience Research
“Insights that are received directly from user experience research are like muscle memory; the more you do research, the more insights you build up. But just like muscle memory, YOU have to be a part of the hard work in order to enjoy the lasting benefits of it that are specific to you. While it may be tempting to outsource research to a specialized team (and sometimes you can’t avoid it), you should try your utmost best to engage in at least a little bit of the research so that the insights grow under your skin instead of being handed to you from someone else who has sweated it.”
The 5 Steps Of User -
Experience Research
Created by Erin Sanders, the Research Learning Spiral provides five main steps for conducting UX research. The first two steps are about forming questions and hypotheses, and the last three steps are about gathering knowledge through selected UX research methods.
• Objectives. What are the knowledge gaps we need to fill?
• Hypotheses. What do we think we understand about our users?
• Methods. Based on time and manpower, what methods should we select?
• Conduct. Gather data through the selected methods.
• Synthesize. Fill in the knowledge gaps, prove or disprove our hypotheses, and discover opportunities for our design efforts.
The Role Of Research In The User Experience Design Process
• UX research is the starting point for a project. Research helps us learn about the users and their behavior, goals, motivations, and needs.
• It also shows us how they currently navigate a system, where they have problems and, most
importantly, how they feel when interacting with our product.
• UX research comes first in the UX design process because without it, our work can only
be based on our own experiences and assumptions, which is not objective.
• As Neil Turner, founder of UX for the Masses told us, a good foundation is key to successful
design: “Good user research is key to designing a great user experience. Designing without good user research is like building a house without solid foundations—your design will soon start to crumble and eventually fall apart.”
The Value of User -
Experience Research
In the current digital product landscape, the real value of UX research is its ability to reduce uncertainty in terms of what users want and need , which yields benefits for the product, the business,
and the users themselves.
Product Benefits
• UX research provides data about the end user of the product, how and when the user will use the product, and the main problems the product will solve. UX research is also helpful when a team has to decide between multiple design solutions.
Business Benefits
• UX research brings a lot of a value to businesses. By knowing the end users and incorporating design requirements upfront, businesses can speed up the product development process, eliminate redesign costs, and increase user satisfaction.
User Benefits
• One of the greatest values of user experience research is that it’s unbiased user feedback. Simply put, UX research speaks the user’s thoughts—without any influence from outside authority. It also serves as a bridge between users and the company.
“User experience research provides powerful insights that allow companies to humanize their customers and insert their needs, intentions, and behaviors into the design and development process. In turn, these insights enable companies to create experiences that meet-and sometimes exceed-customer needs and expectations. User experience research should be conducted well before the first sketch is drawn and integrated throughout the concept, iterative design, and launch phases of a product.”
Experience Research
• Usability Testing
• Interviews
• Online Surveys
• User Personas
User Experience Research Methods: Usability Testing
• According to the usability.gov website, usability testing refers to “evaluating a product or service by
testing it with representative users.”
• During a test, participants will be asked to complete specific tasks while one or more observers watch,
listen, and record notes.
• The main goal of this user experience testing method is to identify usability problems, collect qualitative data, and determine participants’ overall satisfaction with the product.
Why Do We Perform Usability Testing?
• Usability testing helps identify problems before they are coded. When development issues are identified early on, it is typically less expensive to fix them.
• Usability testing also reveals how satisfied users are with the product , as well as what changes are
required to improve user satisfaction and performance.
• Unfortunately, usability testing is not 100% representative of the real life scenario in which a user
will engage with your product
• Also, because the data is qualitative, this kind of UX testing method doesn’t provide the large
samples of feedback a questionnaire might.
• The good news it that the qualitative feedback you receive can be far more accurate and
insightful.
Why Do We Perform Usability Testing?
Best Practices
1. Test with Five Users. Testing five users is typically enough to identify a design’s most important usability problems.
2. Invite Your Team to the Testing Sessions. Anyone who is involved with how fast and how well problems are addressed should be invited to the usability testing sessions. These stakeholders may
include the executive team, and lead developers or designers.
3. Keep the Findings Brief and To-The-Point. When you report the findings of a usability test, limit the comments to the ones that are really important. One good rule of thumb is to include the top three
positive comments and the top three problems. The overall report should be no more than approximately 50 comments and 30 pages.
How to Conduct UX Research with Usability Testing -
Usability testing can be broken down into a few major steps:
1. Identify what needs to be tested and why (e.g. a new product,
feature, etc.)
2. Identify the target audience (or your desired customers).
3. Create a list of tasks for the participants to work through.
4. Recruit the right participants for the test.
5. Involve the right stakeholders.
6. Apply what you learn.
Why Do We Perform Usability Testing?
“One of usability’s most hard-earned lessons is that ‘you are not the user.’ If you work on a development project, you’re atypical by definition.
Design to optimize the user experience for outsiders, not insiders.”
User Experience Research Methods: Interviews
• A well-known user experience methodology is an interview.
• An interview is a user experience research method used to discover the attitudes, beliefs, and
experiences of users (and potential users) of a product.
• Interviews are typically conducted by one interviewer speaking to one user at a time for 30 minutes to an hour. Interviews can take place face-to-face, over the phone, or via video streaming.
Why Do We Conduct Interviews?
• Of all the user experience design methods, interviews are typically conducted at the beginning of the product development cycle when reviewing product goals. Because of the one-to-one nature of
the interview, individual concerns and misunderstandings can be directly addressed and cleared up.
• Face-to-face interviews also allow you to capture verbal and nonverbal cues, such as emotions and body language, which may identify enthusiasm for the product or discomfort with the questions.
• When thinking about what research methodology to use, bear in mind that interviews are also a good supplement to online surveys: conducting an interview beforehand helps you refine questions for the
survey, while conducting an interview afterwards allows you to gain explanations for survey answers.
• There are a few drawbacks, however. First, because interviews require a team of people to conduct them, personnel costs are usually difficult to keep low. Sample size is also limited to the size of the interviewing staff.
User Experience Research
Methods: Interviews
Best Practices
1. Hire a skilled interviewer. A skilled interviewer asks questions in a neutral manner, listens well, makes users feel comfortable, and knows when and how to probe for more details.
2. Create a discussion guide. Write up a discussion guide (or an interview protocol) for all interviewers to follow. This guide should include questions and follow-up questions.
3. Get informed consent. Before conducting the interview, make sure to get permission or consent to record the session. It’s also good to have one or two note takers on hand.
How To Conduct User Experience Research With Interviews
Conducting an interview can be broken down into a few major steps:
1. Prepare a discussion guide, or a list of questions to ask participants.
2. Select a recording method (e.g. written notes, tape recorder, video).
3. Conduct at least one trial run of the interview.
4. Recruit the right participants for the interview.
5. Conduct the interview.
6. Analyze and report the results.
User Experience Research Methods: Interviews
“Curiosity is a natural outcome of caring, and it is the single greatest contributor to effective user
research ... Caring and curiosity engender personal investment, and investment motivates a
researcher to develop a deep understanding of users.”
User Experience Research Methods: Online Surveys
• A survey is a research tool that typically includes a set of questions used to find out the preferences,
attitudes, and opinions of your users on a given topic.
• Today, surveys are generally conducted online and in various lengths and formats.
• Data collected from surveys is received automatically, and the survey tool selected generally provides some level of analysis, the data from which can then be used for user experience studies further down the line to inform your product.
“It is so important to avoid using leading questions when it comes to surveys. It’s a common mistake
that many people make. For example phrasing a question like “What do you dislike about Uber?” assumes the user has a negative preference for the service off the bat. A more neutral phrase would be
“Tell us about your experience getting around town.”
- this elicits more natural user feedback and behavior instead of forcing them down a funnel.”
-Top tip from UXBeginner
Why Do We Conduct Online Surveys?
• Unlike traditional surveys, online surveys enable companies to quickly collect data from a broad (and sometimes remote) audience for free—or a low price. Surveys also help you discover who your
users are , what your users want to accomplish, and what information your users are looking for.
• Unfortunately, what users say versus what they do are two different things and can often yield inaccurate results. Furthermore, poorly worded questions can negatively influence how users respond.
Length can also be an issue—many people hate taking long surveys. This is why it’s important to create short surveys so users are more likely to complete them and participate in future research
efforts.
Best Practice
• Keep it short. Keep your surveys brief, especially if participants will be compensated little or not at all. Only focus on what is truly important.
• Keep it simple. Make sure questions can be easily understood: ambiguous or complex wording can make questions more difficult to understand, which can bring the data into question.
• Keep it engaging. Include a mix of both multiple choice questions and open-ended questions (or questions in which users complete the answer).
How To Conduct User Experience Research With Online Surveys
Conducting an online survey can be broken down into a few major steps:
1. Identify goals and objectives of the survey.
2. Create survey questions.
Note: Consider collecting information about how satisfied users are with your product, what
users like/dislike, and if they have suggestions for improvement.
3. Select an online survey tool (e.g. SurveyMonkey, Qualtrics).
4. Recruit participants.
5. Conduct the survey.
6. Analyze and report the results.
User Experience Research Methods: Online Surveys
“We have to arm ourselves with data, research ... and a clear understanding of our users so our
decisions are not made out of fear but out of real, actionable information. Although our clients may
not have articulated reasons for why they want what they want, it is our responsibility to have an
ironclad rationale to support our design decisions.”
User Experience Research Methods: User Personas
A user persona is a fictional representation of your ideal customer. A persona is generally based on
user research and includes the needs, goals, and observed behavior patterns of your target
audience.
Why Do We Create User Personas?
Whether you’re developing a smartphone app or a mobile- responsive website, any user experience research job will require you to understand who will be using the product. Knowing your audience will help influence the features and design elements you choose, thus making your product more useful. A persona clarifies who is in your target audience by answering the following questions:
• Who is my ideal customer?
• What are the current behavior patterns of my users?
• What are the needs and goals of my users?
User Experience Research Methods: User Personas
Understanding the needs of your users is vital to developing a successful product. Well-defined personas
will enable you to efficiently identify and communicate user needs. Personas will also help you describe the individuals who use your product, which is essential to your overall value proposition.
Unfortunately, creating personas can be expensive—it all depends on how deep into user research your
organization is willing to go. There is also no real “scientific logic” behind persona building, which makes some people a little more hesitant to accept them.
Best Practices
1. Create a well-defined user persona. A great persona contains four key pieces of information: header, demographic profile, end goal(s), scenario.
2. Keep personas brief. As a rule of thumb, avoid adding extra details that cannot be used to influence the design. If it does not affect the final design or help make any decisions easier
3. Make personas specific and realistic. Avoid exaggerated caricatures, and include enough detail to help you find real-life representation.
How To Conduct User Experience Research By Creating Personas
Creating user personas can be broken down into these main steps:
1. Discuss and identify who your target users are with stakeholders (e.g. ux team, marketing team, product manager).
2. Survey and/or interview real users to get their demographicinformation, pain points, and preferences.
3. Condense the research, and look for themes to define your groups.
4. Organize your groups into personas.
5. Test your personas.
“Be someone else. It takes great empathy to create a good experience. To create relevant
experiences, you have to forget everything you know and design for others. Align with the
expected patience, level of interest, and depth of knowledge of your users. Talk in the user’s
language.”
Next Steps: Which User Experience Research Method Should You Use?
Now that you know more about the various user experience research methods, which one do you
choose? Well, it all depends on your overall research goals.
Behavioral vs Attitudinal Research
As mentioned before, there is a big difference between “what people do” versus “what people say.” Attitudinal research is used to understand or measure attitudes and beliefs, whereas behavioral research is used to measure behaviors. For example, usability testing is a behavioral user research method that focuses on action and performance. By contrast, user research methods like user groups, interviews, and persona creation focus on how people think about a product.
Qualitative v. Quantitative Research
Qualitative research methods (e.g. usability testing, user groups, interviews) are better for answering questions about why or how to fix a problem, whereas quantitative methods (e.g. online surveys) are great for answering questions about how many and how much.
3. UI Documentation
- Overview (define)
- Project summary
- Problem (HCW)
- Solution (SWOT)
Focused, actionable, and purposeful. Project’s goals, objectives and vision.
- Market Research
- User Research
- User Personas
- Key Findings
Essential user research includes user personas, empathy maps, user journey
maps, interviews, market research, and any other information that pertains to
the customer.
➔ Definition (Role/Duration)
- Sketch
- Wireframe
- Usability prototyping
- Key Findings
A summary of initial concepts and sketches of how the product’s journey began and the thought processes behind the product’s features. Also include sprints and brainstorming sessions reports
- Prototype
- Final Design
- Prototype
Presented to stakeholders to explore the product and understand the context behind
usability testing and design concepts.
➔ Documentation
- Engineer
- Developer
- Video Prototype
Summarize your UX documentation and include the project’s goals, objectives, and vision.
Allows every stakeholder to read about the UX design process and how the product has
evolved.
- Next steps
- Long term Plan
References, giving context to the product’s lifespan from the initial concept to the current
iteration
- End of Lecture -
INSTRUCTIONS
Task 1 - (20%) App Design Proposal
What you should have in your proposal (First Document)
- DISCOVERY SESSION Surveys, interviews, market studies, and research
- HOW MIGHT WE Project Name, Key Partners, Key Activities, Key Resources, Key Proposition, Customer Relationship, Channels, Customer Segment, Cost Structure, Revenue Stream
Students are required to create proposal documentation for their mobile application project. You are required to redesign an existing app that you find unsatisfactory in terms of the user experience or interface design and its subject to preliminary approval by the module coordinator. Students need to do surveys, interviews, market studies, and research on the selected topic.
The document should also include key features of the app and provide a clear flowchart of the app. The document will determine whether or not the app idea is good to continue to the next development phase. This task is an iterative process whereby during the assignment
period, students are free to get feedback from their peers and module coordinator to further refine their idea.
The document should also include key features of the app and provide a clear flowchart of the app. The document will determine whether or not the app idea is good to continue to the next development phase. This task is an iterative process whereby during the assignment
period, students are free to get feedback from their peers and module coordinator to further refine their idea.
DST 60504 - Application Design 1
Project 1
Mobile Application Proposal - 20%
Task 1 Proposal Google Classroom Link: https://classroom.google.com/u/0/c/NDg5MTExMjAyODk3/a/NTQ0NDkxNTA2Mzg0/details
Task 1 Slides Google Classroom Link:
UX/UI Exercise 1
Download one of the apps in the list and replicate the UI design. Select a minimum of 5 screens (not including onboarding) for the task. You're allowed to use any software (Adobe XD, Photoshop, Illustrator, or Figma) for the task. You may use any images from any resources as long as it is appropriate to the design. You need to study and observe carefully the original design and implement it in your crafting. Focus on the details, examine each pixel use in the original UI design and apply it to your own work.
Here is the list:
Productive - Habit Tracker ( I choose Productive Apps)
Sectograph
Trip
AirBNB
Premier League
Strava
Outcome: Productive - Habit Tracker
I use Adobe illustrator to create it and here are the progress and outcome
Productive - Habit Tracker 1
Productive - Habit Tracker 2
Productive -
Habit Tracker 3
Productive -
Habit Tracker 4
Productive -
Habit Tracker 5
Productive -
Habit Tracker 6
Productive -
Habit Tracker 7
Productive -
Habit Tracker 8
Even is to design it same as the app given, but I realise it is not easy as what I expected. What I learn through the process is the design, colour, layout, font and etc which is so important by creating the apps. I did my best on creating and finalising like the original apps. There are too many animation as some I try to use pen tool on creating myself but some I use Image trace to trace it out as original. I did learn a lot through this exercises.
Comments
Post a Comment