Obvious Always Wins – Luke Wroblewski

 my favorite talk. Luke uses data to tell great stories. Luke pointed out how “obvious” design changes involve tons of thinking, planning and work.

Design is obvious in retrospect. Lots of work goes into making a design obvious.

More companies are moving to a bottom bar layout on mobile for three reasons:

  • you can focus on core features
  • grow critical engagement
  • ergonomics

Quantitative research tells you what happened and qualitative tells you why.

With hamburgers – you are presented with a mega menu list of choices. Overwhelming. With the rise of phablets, ergonomically a bottom menu is easier to use.

Below the fold isn’t the problem – the problem is that people don’t scroll when they think that the site ends. A problem with blocky boxy layouts.

Change makes ppl uncomfortable and the key to failure is to try and please everyone.

Products needs to have a point pf view – don’t blindly copy one or another.

Motion in Design Systems: Animation, Style Guides, and the Design Process  – Val Head

Better animation communication

  • shared vocabulary
  • established animation values
  • documentation and repeatability.

Storyboards and Sketches

  • Where is the potentiual for animation in this flow?
  • How can motion make this easier to understand.
  • How do we animate between views logically?
  • Quick iternations
  • Anyone can make one – just need paper and pencil!

What to draw

Trigger —> Action —-> Quality (how does it happen)

Motion comps – Exactly how does this show how the animation works? Which item should move and when. Does the animation quality match our brand? Tools: Tumult Hype, AfterEffects, Adobe Animate.

Explore the details -> used to test out ideas and communicate deliverables

  • Duration and delay values
  • Details of the easing
  • Repeat values, iterations
  • Deliver the above variables.

Interactive Prototypes

  • What will this interaction feel like?
  • Does animation feel right in this context?
  • How will animations interact with real data?

Define and Document – saving future you time and effort

Design Beyond our Devices – Ethan Marcotte

No more designing for pages or for patterns, design for principles.

Conversations about responsive web design lead to the same place: “Well, where are we going?”

In sum:

  • Mobile is still exploding
  • Ride of tablets and phablets
  • Post desktop investment – watches, fridges, whatever?!??!

Moving from page to patterns. A network of patterns that can be rearranged and moved.

Web’s inherent variability needs to lead to device agnostic content. In addition, 605 of mobile connection is less than 3g.

Desvice agnostic helps users with: hostile, crap browsers, tiny screens, slow networks, touch inputs.

Design for nonideal areas of use. Document your patterns.

  1. Visual hierarchy
  2. Pattern naming and conventions
  3. Translate inventory into HTML and CSS

Team style guide – language meaningful to your team.

from Krys Higgins’ sketchnotes

Thanks to a generous freelance client and some creative funding (i.e., my own money), I was able to attend An Event Apart in Seattle again this year. AEA is billed as a conference for “people who make websites” and continues to impress me. Working in higher ed means we are at least 3 to 5 years behind the curve, so this conference gives me a preview of issues to come and gives me tools, resources, and inspiration for for the road ahead.

I like the fact that there aren’t sessions to choose from – I’m introduced to issues and topics that I normally wouldn’t give a second thought. Like animations, or CSS!

From Research to Redesign: An Unexpected Journey – Jeffrey Zeldman

Design begin with the product.

Talking to stakeholders:

  • what frustrates them?
  • what would they do if they were in charge of the website?
  • talking to stakeholders also gets them on your side!being appreciated, taking them seriously, they will feel invested in what you create.

Research (on other sites) allows us to identify patterns – and what’s working and what’s not. Also uncovers competitive advantages and reveals blindnesses and biases.

Research also saves $ – reveals problems and ensures we solve the correct ones. Allows us to understand market and prioritize high value customers , reveal goals.

Study your market AND your product – find your story

Different ways of engaging with your customers leads to more engagement!

This made me feel good: “Every website needs a lot of work.” Goals/audience are always evolving!

Making the human connection is the real value of research.

  • Know your people
  • Listen and ask questions
  • Define success – where are we headed?
  • Data galore – Data doesn’t provide the answers, just helps us find and refine the questions.
  • Metrics of engagement – now and 6 months from now.

Practical Branding – Sarah Parmenter

No other session made me more wistful than this. Oh, to have the advantages of a true designer working on our brand… Sarah discussed what designing brands (including personal brands) looks like in 2016 in a practical, doable way.

Bring artistry back into design – no more waiting for permission to bring creativity back from big brands like Apple! I worry that if try anything different we could negatively affect user experience.

Branding is the product of deliberate conception – an unexplained emotional connection.

AirBnB – building a visual language 

How do you stand out in a homogenized, blocky web? Research is great, but tends to be swayed by the most vocal people. Contradictions arise.

Great tools:

Work with a copywriter on the design brief. Voice and Tone is defined by the design and refined by copywriter.

Logo should be simple and memorable enough to draw in the sand with one toe (uhoh OSU)

Dominant color pairs really have an impact on the web.

from Practical Branding – Sarah Parmenter

With social – pick a lane – what makes the most sense for your brand?

Company values  – they are a story that can help you define your brand.

Onboarding for Any Situation – Krystal Higgins

 In this sense, onboarding mens getting your users ready to use your product/site.

Opportunities arise over time. There are diverse methods for onboarding and you can offer your users long term guidance.

Familiarize -> Learn -> Convert – > Guide them = leads to daily engagement. Days 3 -7 most critical.

Research at Google – Minimizing change aversion

5 second test – what is this site about, what is it’s mission.

Onboarding is not a fixed path, rather it’s a different experience for all

Learn best by experience – experiencing something multiple times and modalities.

  1. Default experiences – starting to use the product, Strong IA.
  2.  Inline guidance – weave information into content.
  3. Reactive guidance – happens when you trigger an action, signaled intent.
  4. Proactive Guidance –
  5. On Demand guidance – a centralized help area

Always looking for ways to make onboarding more accessible.

Start at the end  – unveil those key actions, what ppl need to know. Learn from your core users (sustainers) and your unsuccessful users. Why did they bail?

Rachel DeLauder @rdelaude

How ARE people actually running their web teams in higher ed?

Rachel conducted surveys, 1 on 1 interviews to find out more

Most teams struggle to find balance and spend a lot of their time maintaining content.

Two types of web teams – MarComm based and IT based
Marcomm more slick, consistant with brand messaging
IT based more around load times, permissions, etc.

How can we improve: (these things make it better in an ideal world):

  • Single leader who was held accountable
  • Having an editor in chief
  • Supported by web specialists who have a stake in the process.
  • Distributed authors and SMEs that understand the goals and UX of the site.

Workflows in units by expertise, not by org chart.

SMEs to edit text, specialists to build pages.

Outsource hosting and maintenance.

Develop a “Lines in the Sand” matrix for the CAS Web Team (slide 46).

Infiltrate committee meetings

Takeways:

  • We are not alone.
  • Develop a matrix to show users.
  • Convince units to assign web person based on interest?
  • Keep track of working time to show leadership what we are actually doing?

This book is short, well written, and gives the reader a LOT to think about. I’ve been reading it in small bits because I end up taking so many notes.

Chapter 3 – The Process

The systematic inquiry for research:

  1. Define problem
  2. Select approach
  3. Plan and prepare research
  4. Collect the data
  5. Analyze the data
  6. Report results

(see Fig. 3.1 on page 39)

Base your definition on a verb that has an outcome – identify, evaluate, etc.

Your problem will point you to a style of research.

Research plan:

  • problem statement
  • duration
  • who is performing what roles
  • how to target and recruit
  • incentive, tools and materials

Perform a screener to test possible participants – a simple survey that identifies:

  • what are specific behaviors
  • Level of tool knowledge and access
  • what knowledge of the topic do they need?

*Usability testing is necessary, but not always sufficient*
It provides you with a story, predicts what may or may not be successful, pre Q&A testing, identifies which user tasks are important.

Good participants, good facilitation and good analysis is important – not a perfect usability lab setup. Real life isn’t conducted in a lab!

Analyze the data:

  • Look for meaningful data
  • Turn into observations, which will then turn into
  • Recommendations

Chapter 4 – Organizational Research

User-centered design considers client stakeholders part of the standard requirements.

Asking the same questions of different people will lead to understanding differences in motivation and understanding.

A stakeholder is a group without whose support the organization would cease to exists. Plan to:

  • Neutralize politics (yeah, right)
  • Understand priorities within organization
  • Tailor the process to work methods
  • Technical & business requirements
  • Getting buy in
  • Understanding how your work affects the organization
  • Understanding the workflow

Interviewing stakeholders:

  • Set agenda and send a few key questions ahead of time.
  • Good questions on page 67 & 68
  • Document attitude and they see as goal

Business requirement – a clear statement of what success will look like. What the doc should look like:

  • Problem statement
  • Gather ALL of the goals
  • Success metrics
  • Completion critera
  • Scope (boundaries). Note what is OUT of scope.
  • Risk, concerns, contingency plans
  • Workflow diagram
  • Add verbatim quotes for impact!