Upload
dandineenuob
View
73
Download
0
Embed Size (px)
Citation preview
The lucky component was the Summary Section
It appears on every content type in one form or another
It is the first chunk of page-specific content the user sees. It sets the tone.
Sprint A - Prototype
Quick iterations on the current design, informed by our research & guided by previous work.
Build ‘em quick, pile ‘em high. Generate an idea and then move on.
Sprint A - Prototype
We then convened the greatest minds of our
generation, put them in a small room and let them
fight it out over which designs were ripe for testing.
Liam, Rich, Phil and I talked it through over
biscuits & tea.
And then we tested. On you. The real users.
As many as we could get in a short space of time, across as varied a set of departments and faculties as we could manage.
If you helped - Thank you :-)
Sprint A - Test
The more defined the title, the better A bolder font weight and contrasting colour helped users scan the title.
Ambiguity is bad Links should look like links. If not, people will keep missing them.
Don’t be disingenuous If it looks like a button then users will click it. Which is great.Unless it isn’t a button!
Date and status Users were bemused by the status and start/end date structure
Sprint A - Test feedback
TL;DR The current design got a bit of a kicking :-( Reaction to the prototype designs suggested we were heading in the right direction :-)
Sprint A - Test feedback
Tighten the summary section typography Group metadata in an easily readable area
Get the information hierarchy and balance right
Give links an appropriate level of prominence
Sprint B - Refine
Sprint B - Implement
<section class="summary-information"> <div class="row">
<!-- Title --> <div class="small-24 columns"> <h1>Renting a property to students</h1>
</div> <!-- Summary -->
<div class="small-24 medium-20 columns end"> <p class="summary">If you're thinking of renting accommodation to students…</p>
</div> <!-- Metadata -->
<div class="small-24 columns"> <ul class="meta-data">
<li class="content-type-label">Guide</li>
A results business
A cleaner, easier-to-scan summary section Considered semantic HTML structure - accessible
Clear, obvious navigation pathways
Understandable, relevant metadata grouped logically
Sprint X - What now?
Live as we speak. We will get feedback. Think about the ‘special’ content types - Events etc.
Iterate campaigns & projects - start/end dates
Apply our design thinking to more components
https://wiki.bath.ac.uk/display/webservices/Summary+section+user+testing+-+Results
Anonymous results