The final Supervisor guide with an explanation about each section and the learning outcomes for the tasks. And the worksheet that the users must complete.
InVision app has the new feature to use a screen as an overlay, i incorporated three overlays into the app and thought it looked very professional, the pop ups were saved as PNGs with no background so the user can still see the main screen in the background. Each pop up is linked to go back to the page that the user just came from. I used the pop ups for the hexagon timer which is on most pages (so the user can see where they are in the app) and also for the question mark suggestions, where the pop up tells the user possible suggestions for them to answer the activity
The final icon explanation screens. I found this difficult to display in an orderly fashion, there was also too many icons and explanations to do it in any of the previous layouts for the app. But i am happy with how it turned out, i definitely think it looks much better with the white explanation hexagons
Throughout the app i have only used three main layouts as well as the three main colours, with only the content or icons changing, this was to provide the user with some familiarity. Each background is the same layout and then there is either the small hex pop ups, which explain something to the user, the larger hex flower, which either explain something or ask the user to do an activity or the square box which asks the user to type within it and answer the questions asked.
For continuity i also wanted to keep the hex timer in the bottom left corner and the next page arrow is always on the bottom right corner.
Below are two colour variations of the icons that i have created for the app, within the app there will be an explanation page about all of the icons. Im happy with how all of these look in both colours
Below is a list of each page and the content wrote on it is, as you can see there is a lot less text on each page and the directions are also more clear:
Completion page – Amazing, you’ve completed every section
This section is about online awareness and what can happen with our information. You will work alone and then have a group discussion.
What you do
In the old days it was like footprints in the sand and they would vanish
In the digital world your footprints can now often be permanent
Which means they can be copied and shared
How do you keep information private in the real world?
How do you keep information private in the digital world?
Before you post anything online think..
What information do you want to share?
What information do you want to keep private?
Discuss with the group
This section is about being grateful for the things we have in our life. You will work alone on the app and also receive a worksheet to complete.
Type 1 thing in your life that makes you feel happy
Type 1 thing in your life that makes you feel supported
Type 1 thing in your life that makes you feel loved
Type 1 thing in your life that makes you feel encouraged
Type 1 thing in your life that makes you feel excited
Suggestion in corner – This could be anything like : People in your life Family or friends, Pets, Places you’ve visited, A memory, A conversation, Something your looking forward to in the future
Collect a worksheet and a selection of paints from the supervisor
Complete the instructions on the worksheet and upload a picture onto the app
This section is about social awareness and how interacting with people online can be different to interacting with someone in person. You will work in pairs, one partner will be online and one will be in person
List 3 compliments to send to the person in front of you
Suggestion in corner – Tell them why they are wonderful, what makes them unique and why you enjoy being around them
List 3 compliments to tell the person beside you
After both interactions
How did each person react?
Could the online receiver show their reaction over the iPad?
How did it make you feel to see the receivers reaction when you had a conversation?
When sending something online
Could what you are sending get misinterpreted
Will the receiver understand without seeing your body language and expression?
Testing 3 large hex flowers for placement of the 3 different sections. I think with all the different shapes in the image that the user would be very distracted and not be able to differentiate between the background and the three shapes correctly
This is the three single colours which will be the backgrounds of each section, I’m very happy with how they look as they are very fresh and vibrant