When moving onto digital wireframing I first began by creating a few components that I believe I may need. These included frames, input elements such as buttons and list items and content items such as images videos etc.

https://whimsical.com/wireframe-FKeRPq92KnUAB7zZpDa19X@7YNFXnKbYotdffFXCzpMS

Working strictly off my sketches I basically digitized them allowing me to iterate on them later if necessary.

As I found in my research those with ADHD are more hand on people this being the case I designed an interactive App for tablet as the main device to be used. Whilst using the app all incoming notifications from other apps will be blocked to reduce distractions during a session, above you can see the point of the project we are at currently things may change as development goes on, perhaps favoring a grid design pattern to reduce scrolling. This is the dashboard and from here a user can navigate to anywhere within the app. Quick links to specific skills subjects and years of study are all featured here for usability, I have to have a busy dashboard although I would prefer to have it extremely simplified to reduce distraction. Ive been debating having year specific links to enable the teachers and parents to reduce distractions further for the students but for purposes of showing the contents of the app fully.

Here is the recommendations page this is where the AI kicks into gear showing students what they need to be working on as their skills are lacking here. let’s take reading for now the student would click reading which would be a fully clickable block which would bring us to the reading skills subpage.

From here the student would select “Determine the main passage” for example which would bring the student to another location where the AI kicks in. Here i have chunked the information by skill on the website IXL they have every skill on the same page i have hidden most of them behind the clickable CTA’s at the top of the screen to the student wont be overwhelmed with information. Each skill is lettered and numbered to help with the backend requirements allowing the AI to catagorise and seperate its data better.