osm-export-tool icon indicating copy to clipboard operation
osm-export-tool copied to clipboard
verified publisher icon hotosm

Update UI Design to Reflect HOT Brand

Open mataharimhairi opened this issue 6 years ago • 3 comments

The firm Major is currently designing the new Tasking Manager UI, following the core HOT branding style. They are creating a tool style guide from this work which will be used for revamping the Export Tool so that the new release will also follow the core HOT branding style.

image8

image3

mataharimhairi avatar Jun 03 '19 18:06 mataharimhairi

Timeline from @hexiaok for updating the Export Tool UI design over the month of September:

Screen Shot 2019-09-03 at 11 53 11

mataharimhairi avatar Sep 04 '19 00:09 mataharimhairi

@hexiaok has uploaded the spec screens and design assets (eg.SVG) to Zeplin: https://zpl.io/25xY0mj and Google Drive: https://drive.google.com/drive/folders/15ld2DtAexLxnehHbZ-vIty6ga4NHJGiE?usp=sharing

Export Tool-Create_Describe Page

Export Tool-Landing Page

TM typography & style guide components (use React for front-end):

  • color palette variables: https://github.com/hotosm/tasking-manager/blob/develop/frontend/src/assets/styles/_variables.scss
  • color classes (background, color, borders...) https://github.com/hotosm/tasking-manager/blob/develop/frontend/src/assets/styles/_colors.scss
  • typography classes: https://github.com/hotosm/tasking-manager/blob/develop/frontend/src/assets/styles/_typography.scss

(Any questions @willemarcel will be the best person to consult :)

mataharimhairi avatar Oct 07 '19 06:10 mataharimhairi

It would be best to integrate this with a rework of the login system and frontend. Removing the requirement to log in via OSM account will make it more frictionless to download exports.

bdon avatar Dec 21 '19 21:12 bdon