Style ideas

[peterwoodward-court]

Hi all - good to see you today :) Some thoughts on colours:

Green for background of history: #009f5c
Red for background of examination: #e4012e
Yellow for background of other: #fec311
Tan for 'background' (i.e. what is currently grey): #EAB988

These colours are based on a particularly ubiquitous textbook (Oxford Handbook of Clinical Medicine) and would be familiar to lots of medical students, however, I am very happy to take stylistic input if you think they're naff!

For the font I was thinking Roboto Light (bolded?): https://www.fontsquirrel.com/fonts/roboto

For the 'add station' activity, instead of the cross and tick as we currently have it, perhaps a style with a bar on the top and a back arrow and a tick could look a little cleaner? Here's an example from another app: https://imgur.com/a/aBHzgCD

Let me know your thoughts. I'll get working on some station data to give you and thoughts on the stats page.

See you tomorrow!
Peter

@Brymon @sima-qian @njons @martingaston

[sima-qian]

I am very happy to take stylistic input if you think they're naff!

I know @njons and @Brymon have strong opinions about colours. I quite enjoy the bold contrast of the yellow, green & red, though I'm not a massive fan of the beige.

For the font I was thinking Roboto Light (bolded?)

We're actually already using Roboto for body text. I think we're using Regular rather than Light as the latter seemed a too thin to us. The font we're using for titles is Nova Round -- this is the one that with current kerning has the VOMITING <--> VOMMING issue.

... perhaps a style with a bar on the top and a back arrow and a tick could look a little cleaner?

I like this idea. I think it'll make the layout more manageable on those pages currently carrying cross/tick buttons and can also hold the page title as in the example you link to.

[njons]

Hi @sima-qian & @peterwoodward-court,
Good news! We are already using the suggested yellow and a red that is very similar.
I have also reworked the layouts in line with the comments above and am able to share a screenshot here after getting an ok from the team. 👍

[peterwoodward-court]

We're actually already using Roboto for body text. I think we're using Regular rather than Light as the latter seemed a too thin to us. The font we're using for titles is Nova Round -- this is the one that with current kerning has the VOMITING <--> VOMMING issue

Cool - if people are happy then perhaps we could try Roboto for the title text too then?

Thanks for the update @njons! Looking forward to seeing some screenshots soon :)

[peterwoodward-court]

(sorry accidental close...I know my way around github...)

[njons]

Hi @peterwoodward-court,
Here are some screenshots of what we will be aiming towards today after taking in your comments.

Please note that:

• We have taken in your suggestion of a top bar for the two revision pages
• We would definitely suggest moving forward with the ones in this screenshot: your green, your yellow and our red as we thought they balance better together group (we hope that it will be enough to hint at the reference set of colours) and our grey (again for overall balance reasons)
• I have added in a blue since we have four nav bar elements and a dark grey for the top bar on the revision pages

Overview of all pages:

Closer detail of the green section:

[peterwoodward-court]

Super stuff, thanks @njons

A few thoughts:

• I like the top bar and think it's a good improvement
• Very happy with my green, my yellow and your red
• I'm not sure the grey/beige quite works - is it worth simply trying white?
• Is it possible to try zero padding between the stations, cases and mark schemes? With a single pixel of grey/black to separate them. Like this: https://imgur.com/a/pJCOnsa
• Was there any consensus on changing the font from Nova Round to Roboto?

Thanks all!

[sima-qian]

Was there any consensus on changing the font from Nova Round to Roboto?

I think it's generally nice to have two fonts -- one for titles and one for body text. We have Roboto for body text, so would you be happy to stick with Nova Round for the titles? We could change the stations names on the screen below from titles to body text, to stick with the usage on other pages.

[peterwoodward-court]

@sima-qian that sounds like a good idea. I'm happy to have two fonts too - but maybe a different one to Nova Round to avoid the vomming issue?!