To create style requirements to ensure consistent design across all pages of the MVP

lottycoupat commented 3 years ago

Summary

This issue is to ensure that the style of the pages that are developed by different people is consistent. To ensure this, a style requirements doc will be created with guidelines on what the specific styles need to be on the page. This includes: font size, colour, shape of buttons etc.

Deadline

18/06/21

What needs to be done?

[ ] Agree style design to follow
[ ] Draft style requirements
[ ] Review style requirements
[ ] Publish and share style requirements

Who can help?

Anyone interested in development of pages for the MVP.

lottycoupat commented 3 years ago

@GeorgiaHCA Have created this issue after a discussion with Anoushka today. She has been working on the landing page and wants to ensure that any styling that is being created on the landing page is consistent with all other pages.

Do we have a set of style guides that are more specific than the wireframes already?

If not, should we base all other pages on the style that Anoushka has developed so far for the landing page? (What she presented yesterday in the coworking session)

GeorgiaHCA commented 3 years ago

Thanks for thinking this through @lottycoupat and @anoura12 ! We don't have a bespoke set of style guides however:

I would recommend using gov.uk style guides for accessibility. For the MVP it doesn't need any design flourish but it does need to be accesssible: https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/ - there is one specifically on autism but all are important
It would also be good to look at the focus group recommendations in the project managemeent folder on platform design, as well as the user teseting, for more detai, but this mayb more feasible/snsible to do after the basic MVP

GeorgiaHCA commented 3 years ago

Designing for users on the autistic spectrum - Summary

Do:

use simple colours
write in plain English
use simple sentences and bullets
make buttons descriptive - for example, Attach files
build simple and consistent layouts

Don't:

use bright contrasting colours
use figures of speech and idioms
create a wall of text
make buttons vague and unpredictable - for example, Click here
build complex and cluttered layouts

GeorgiaHCA commented 3 years ago

Ugh sorry that's so tiny! Trying to copy from a PPT :/ ...

GeorgiaHCA commented 3 years ago

Additional design considerations

(A P d): "that actually matters to me because I... switch between android and iPad, and It's how I choose to live my life, but it can be annoying when things don't work out"

(A d): bring one thing up at a time

(A d): "just one thing or question or visual per page, and then...press next"

Back-to-top button

(A d): "the words used, or any writing used" should be "well-spaced out and in a good font that anyone could read - and obviously a screen reader could pick out as well"

(A d): make a button you can press for help to come up

(P d): Have a tagline: "this is what we're looking for, this is what we want from you, and this is what we're going to do, and don't be afraid to repeat yourself just literally on every page like, this is what we want, this is what we need from you, this is what we expect from you"

(A d): "I'm very prone to information overload, so I would want from my point of view this default interface to be as plain and un-distracting as possible...I wouldn't want something that was busy and distracting, it just needs to be focussed on the content.

Blog by an autistic UX designer: https://uxmastery.com/researching-designing-for-autism/

GeorgiaHCA commented 3 years ago

Here's a selection of comments from people in co-creation sessions/discussions. I'd suggest for the MVP concentrating on these aspects:

(A d): bring one thing up at a time

(A d): "just one thing or question or visual per page, and then...press next"

(A d): "I'm very prone to information overload, so I would want from my point of view this default interface to be as plain and un-distracting as possible...I wouldn't want something that was busy and distracting, it just needs to be focussed on the content.

alan-turing-institute / AutSPACEs