After the Usability Test, one of the improvements I had to add was to create Onboarding screens. As said, I used inspiration for the Onboarding UI screens from Mobbin. The onboarding sketches (First and second wireframes) feature a process bar showcasing how many screens there are that the user will follow. It showcases a short description of the features and an illustration to boost the visual look of the screens. The focus is to explain the features in a quick but effective way, so the overall process does not drag on.
The third screen is the pop-up explaining what the skin Score content is about. I figured that whenever the user taps on the explanation, it shouldn't take them to another screen which is why I drew a pop-up instead. The content is mostly seen as side information so it is not overall important as it will only showcase a short description.
As for the fourth screen, users can view all of their answers from the assessment by accessing the Inputs screen. This screen also follows a simple structure, allowing users to skim through content without any CTAs.
In relation to CTA, there is a Restart button at the bottom; when I was sketching this wireframe, I thought it would be a good idea for users to re-do the test if they have tapped a mistake on the question. However, reviewing this part again, it wouldn't really be a good idea. This is because the report is automatically sent to the doctor, and if a user was to restart it, and the doctor at that current moment is inspecting the report, it could mess up the data system. Meaning there would be flaws in the system where the doctor could be reviewing the deleted report instead of the re-do results. This can also cause real-life complications if the patient is at a check-up and the doctor finds out that there are no concerns in their condition.
Explanation on these screens can be read here:
Patient Onboarding
Doctor Onboarding
This is a snippet of the screen, as the actual screen is very long.