1. Design & User Centered Practices
Shelby Morgan
NCDB Staff Meeting 2017

2. Purpose Best practices for design & user experience/interface
Growing body of knowledge around website design and user experience
Brief tour of concepts
Familiar to you
Over the last day we have defined, reviewed who are users are and what our content is. Now let’s look at best practices around web design and user experience/user interface.
So that when we look at examples you have context for your thinking and you understand terms.

3. Design Defined Design exists to solve problems
Whether it is a bridge, products or websites
Often in ways that are small or subconscious
Good design is invisible
End user always at the forefront of design
More than just aesthetics
Good design is when you experience whatever is being presented to you. It is simply usable and straight forward. You do not have to google how to use it.

4. 4 Basic Principles of Design
Contrast
Created when two elements are different. It creates effect and dynamic. Seems simple but it is important and often overlooked. Must be strong in order to be effective. Ex: Using bold.
Repetition
Repeating elements like colors, shapes, textures, lines, fonts.
Alignment
Purposeful placement of elements. Connection between elements on the page. Nothing floating, etc. This creates cohesion.
Proximity
Related items grouped together. Appropriate organization of information placement.

5. Website Design Definition Web Designer vs. Web Developer
Web design governs everything involved with the visual aesthetics and usability of a website—color scheme, layout, information flow, and everything else related to the visual aspects of the UI/UX (user interface and user experience).
Web Designer vs. Web Developer
Web design is concerned with what the user actually sees on their computer screen or mobile device, and less so about the mechanisms beneath the surface that make it all work. Through the use of color, images, typography, layout and interaction they bring a digital experience to life.

6. Website Design Iterative within confines
Style Guides and Principles to make decisions by
Promote consistency and cohesion
Brand Identity
Content is important
“Content precedes design. Design in the absence of content is not design, it’s decoration.” -Jeffrey Zeldman
Jeff and Elizabeth will get to specific details later in the day about web design and what we currently have.
Iterative not for the sake of change but refinement based on what we know and discover about users.

7. User Experience
User experience (UX) focuses on having a deep understanding of users, what they need, what they value, their abilities, and also their limitations.
UX best practices promote improving the quality of the user’s interaction with and perceptions of your product and any related services.
Useful: Your content should be original and fulfill a need
Usable: Site must be easy to use
Desirable: Image, identity, brand, and other design elements are used to evoke emotion and appreciation
Findable: Content needs to be navigable and locatable onsite and offsite
Accessible: Content needs to be accessible to people with disabilities
Credible: Users must trust and believe what you tell them

8. User Centered Design Process
Design is based upon
explicit understanding of users, tasks, and environments
driven and refined by user-centered evaluation
addresses the whole user experience
The process involves users throughout the design and development process and it is iterative.
There is a growing base of literature around cognitive science and the behaviors of humans around internet patterns. Social Media, twitter and facebook have all been influencers on the pattern of behavior for which people consume information.

9. User Centered Design Process: Phases
Specify the context of use: Identify the people who will use the product, what they will use it for, and under what conditions they will use it.
Specify requirements: Identify any project requirements and user goals that must be met for the product to be successful.
Create design solutions: This part of the process may be done in stages, building from a rough concept to a complete design.
Evaluate designs: Evaluation - ideally through usability testing with actual users - is as integral as quality testing is to good software development.
Context of use - 30% of hits come from a mobile device. We need to think about how they are using our website.
We did extensive usability
When you do user centered design, you are getting information about what would best meet the need and not what we think meets the need.

10. Persona Purpose of Building a Persona
To create reliable and realistic representations of your key audience segments for reference.
Personas help to focus decisions surrounding site components by adding a layer of real-world consideration to the conversation. They also offer a quick and inexpensive way to test and prioritize those features throughout the development process. In addition they can help:
Stakeholders and leaders evaluate new site feature ideas
Information architects develop informed wireframes, interface behaviors, and labeling
Designers create the overall look and feel of the website
System engineers/developers decide which approaches to take based on user behaviors
Copywriters ensure site content is written to the appropriate audiences
Context of use - 30% of hits come from a mobile device. We need to think about how they are using our website.
We did extensive usability
When you do user centered design, you are getting information about what would best meet the need and not what we think meets the need.

11. Persona Activity

12. References
Frost, B. (2016). Atomic design. Pittsburgh, PA: Brad Frost.
Larson, M.B., Lockee, B.B. (2014). Streamlined ID: A practical guide to instructional design. New York, NY: Routledge
Reynolds, G. (2014). Presentation zen design: A simple visual approach to presenting in today’s world. Berkeley, CA: Peachpit Press.
Shiotsu, Y. (no date). Web design vs. web development. [Web article]. Retrieved from development/
Williams, R. (2008). The non-designer’s design & type books, deluxe edition. Berkeley, CA: Peachpit Press.
Usability.gov (no date). User-centered design basics. [Web article]. Retrieved from (