Create the Figma Design. - Githubissues

fack2 / attention-training

Attention training is a project that helps neuro-diverse people diagnose their specific type of ADHD and provides guidance to them.

MIT License

0 stars 2 forks source link

Create the Figma Design. #1

Closed FarahZaqout closed 4 years ago

FarahZaqout commented 5 years ago

Design the UX and UI of Attention Training with Figma. The design should be `mobile-first`.

Pages:

[ ] Landing page / quiz (point-based system
- H1 -> What’s your ADHD superpower?
- Two lines of context info
- Scroll through questions (Dice.Fm mobile app, typeform)
- Form Inspiration
- Question List
- Progress bar
- Potential for smooth scroll to next question, when user has selected an answer
- Submit button
[ ] Results page
- What form of ADHD a person exhibits most
- Submit button
[ ] Dashboard
- Link to Results (come in 4 different flavours - inattentiveness, hyperactivity, both, none)
- Retake the test
- COPY: Link: Use your superpowers (feedback loop)
- Your potential super power (hyper creativity, hyper focussed, hyper sensitivity)
  - Description
  - “Discover your triggers/patterns”
  - Build feedback loops
- COPY: Link: I’m in trouble
  - Short term solutions:
    - COPY: Having trouble getting started with a project I need to get finished
    - COPY: Having trouble completing something and putting it out there
    - COPY: Caught in a hyperfocussed binge.

Inspiration:

The mobile version of dice.fm.
Type Form for the form design.
Links with cool animations from Yousef

FarahZaqout commented 5 years ago

Add a link to the figma design in the issue.

saharAdem commented 5 years ago