User Experience Fission Team Training
-
Upload
fission-strategy -
Category
Technology
-
view
108 -
download
2
Transcript of User Experience Fission Team Training
What is UX?
In terms of website design, UX involves enhancing a user’s experience and interaction with a website or app. Among other things, this can include:
● ease of use● user flow● how intuitive navigation is● overall functionality● meeting user’s expectations
What is UX?UX can involve:
● Stakeholder interviewso Website users, organization
supporters, staff, etc.● User testing● User-centered Design (UCD)
o Designing with users’ needs in mind● Visual deliverables
o Data maps, workflows, user flows, sitemaps, and wireframes
Why UX matters
Here are a few reasons why UX is important:
● User experience can set a company or brand or product apart from otherso When there is little to differentiate one product from another,
good UX can be that difference● Selling an experience vs. selling a product
o UX shifts the focus from delivering a great product to delivering a great experience
● It’s smarto Spend more time planning and less time fixing
Why learn UX
Why everyone should learn (or at least be familiar with) UX:
● Everyone ends up doing a bit of it--all of us have all already done some UX
● It’s a step-by-step processo Research > Analysis >
Design● It isn’t hard to learn
Design and Development Process
UX is one of the first steps in the design and development process:
Discovery > UX > UI > Design > BE/FE > QA
Design and Development Process
UX work should start 2-6 weeks before development depending on approach:
● Waterfall workflowo Next stage of development does not begin until previous one
has been completed● Agile workflow
o Different stages of design and development process happen simultaneously and inform each other
Understanding Users and UCD
It’s important to understand the people who will be using the technology we develop. This is the aim of User- Centered Design, or designing and developing with users’ needs in mind. UCD can include:
● Surveys and Interviews● Qualitative and quantitative data--such as analytics● Word maps, Concept maps, User Flows, Personas● Contextual inquiry--observing someone use the website
UCD -- Concept Maps
Concept Maps depict suggested relationships between concepts. They are a useful brainstorming tool during the early stages of a project that helps organize thoughts and ideas in a visual way.
UCD -- 5 W’s + H of Users
● Who are our users?● What are their habits?● Where are they accessing from?● When are they visiting our website or app?● How are they accessing?● Why are they made (Personas)?
UCD -- Personas
Personas are hypothetical users made from emerging themes found in the research phase. For example:
● 20 year-old college student (who?)● Texting, Snapchat, Instagram (what habits?)● School and home (where are they accessing from?)● Evenings (when are they visiting our website?)● Phone (how are they accessing?)
UCD -- User Flows
User flows illustrate the way a user navigates a website. They are particularly useful as they give an idea of the various decisions and options a user will encounter while navigating the site.
UCD -- Sitemaps
Sitemaps are hierarchical diagrams of the pages on a website. They lay out the general structure and organization of the site, and are useful for designers as well as developers.
UCD -- Wireframes
Wireframes are visual representations of the pages of a website. Before the design stage, wireframes allow to focus attention on content placement and strategy. They are a rough sketch of what each page will look like.
Conclusion
● UX is an important part of the design and development process
● We are all already doing some UX
● Ideally it saves time and money
● Helps create a product with the user in mind
Attributions“touch-screen” by Yamini Ahluwalia from the Noun Project
“clipboard” by Creative Stall from the Noun Project
University College London, User-Centered Design, http://blogs.ucl.ac.uk/ele/files/2012/09/BBA2_Fig5-1_UCD_wiki.png
The Oatmeal, What I Want from a Restaurant Website, http://theoatmeal.com/comics/restaurant_website
Yale Instructional Technology Group, Concept Map, http://itg.yale.edu/files/2014/02/conceptMap_processed.jpg
Yalantis, User Flow, https://yalantis.com/media/content/ckeditor/2014/10/4-user-flow.png
General Assembly PowerPoint, Wireframe