wireframes & user testing
DESCRIPTION
This is a report showcasing the user flow of interactive wireframes (with links to the Invision version) after three rounds of user testing had been done.TRANSCRIPT
1
logandowell.com
Taskly WireframesThis is a report on non-interactive and interactive wireframes after extensive user testing.
2
Mobile Platform
Tablet Platform
Desktop Platform
Add & Delete Calendar Event
Add & Delete Calendar Event
Add & Delete Calendar Event
Add & Delete Project
Add & Delete Project
Add & Delete Project
03
08
17
04
09
18
06
13
22
Contents Follow the bright blue road!The user flow that must be taken to achieve the goals set out during the user test have been guided by a large bright blue arrow. The grey arrows are optional pathways to achieve extra goals.
Testing ProcessTo perform the interactive user testing, the following process for each individual tester comprised of:
• Summarising the persona they would adopt;• Giving them a run down of what Taskly is and what it wants to
achieve;• Reassured them they are not being tested, but rather it is the
application;• Provided them with a clear goal as to what they needed to do,
once they achieved that goal they would be given a new goal to follow until the exercise has been completed; and
• Asked follow-up questions to help find underlying points they agree or disagree on.
Features tested for each person involves the Calendar and Projects section (adding, editing and deleting an event and project). Please note that these tests have been conducted physically with paper prototypes and online using Invision through Skype’s screen sharing.
Interactive WireframesThe following links will allow you to test Taskly for yourself, using Invision:
• Mobile: https://invis.io/UA54L6FBJ• Tablet: https://invis.io/S654LPH5M• Desktop: https://invis.io/5Z5AGM7T3
3
Mobile PlatformWireframe user flows for use on mobile devices.
4
Add & Delete Calendar EventMobile Platform
Calendar’s home page. Enter details into new calendar event.
Add new calendar event.
01 03
02
Go to Projects
01 02
03
OPTIONAL OPTIONAL OPTIONAL OPTIONAL OPTIONAL
OPTIONALOPTIONALOPTIONALOPTIONAL
5
Add & Delete Calendar EventMobile Platform
Confirmation that you created a new calendar event. Sharing the event with a team or individual. Warning prompt when deleting the event.
Team and individuals added to the event. Confirmation that event is deleted, can undo.A calendar event’s page to edit its details.
04 06 08
07 0905
Back to Start
04
05 06 07
08 09
OPTIONAL
6
Add & Delete ProjectMobile Platform
Project home page. Enter the project’s name.
Enter the project’s description.Click to create a new project.
01 03
0402
Go to Calendar
01 02
03 04
OPTIONAL
OPTIONAL OPTIONAL
OPTIONAL OPTIONAL OPTIONAL
7
Add & Delete ProjectMobile Platform
Confirmation that you created a new project. Invite a team or individual to collaborate. Warning prompt when deleting the project.
Team and individuals added to the project. Confirmation that project is deleted, can undo.A project’s page to edit its details.
05 07 09
08 1006
Back to Start
05
06 07 08
09
10
OPTIONAL
8
Tablet PlatformWireframe user flows for use on tablet devices.
9
Add & Delete Calendar EventTablet Platform
Calendar home page.01
Go to Projects
01
OPTIONAL
OPTIONAL
OPTIONAL
10
Add & Delete Calendar EventTablet Platform
Pop-up to create a new event. Add a description to the event.
Drop-down menu to select where to post event.
02 04
03
02
03 04
OPTIONAL OPTIONAL
11
Add & Delete Calendar EventTablet Platform
Confirmation that you created a new calendar event. Drop down menu to share with a team or individual member.
A calendar event’s page to edit its details.
05 07
06
05 06 07
12
Add & Delete Calendar EventTablet Platform
Edit event page with team and individuals added. Confirmation that the event has been deleted, with undo.
Warning prompt when going to delete an event.
08 10
09
Back to Start
08
09
10
OPTIONAL
13
Add & Delete ProjectTablet Platform
Home page for projects; projects horizontally scroll.01
Go to Calendar
01
OPTIONAL OPTIONAL
OPTIONAL OPTIONAL
14
Add & Delete ProjectTablet Platform
Pop-up to create a new project. Enter the project’s description.
Enter the project’s name.
02 04
03
02 03
04
OPTIONAL
15
Add & Delete ProjectTablet Platform
Confirmation that you created a new project. Invite a team or individual to collaborate.
A project’s page to edit its details.
05 07
06
05
06 07
16
Add & Delete ProjectTablet Platform
A project’s page with team and individuals added. Confirmation that the project has been deleted, with undo.
Warning prompt when attempting to delete a project.
08 10
09
Back to Start
08
09
10
OPTIONAL
17
Desktop PlatformWireframe user flows for use on desktop computers.
18
Add & Delete Calendar EventDesktop Platform
Calendar home page.
A window to add a new event (pushes calendar dates down).
*Projects can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
01
02
01 02
OPTIONAL
19
Add & Delete Calendar EventDesktop Platform
Drop-down menu to select where to post the event. Enter the event’s description.
Drop-down menu to reveal options for the time and date.
03 05
04
*Projects can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
03 04
05
OPTIONAL
20
Add & Delete Calendar EventDesktop Platform
Confirmation that you created a new calendar event. Drop-down menu to add teams and individuals to share event.
A calendar event’s page to edit its details.
06 08
07
*Projects can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
06 07 08
21
Add & Delete Calendar EventDesktop Platform
Calendar event’s page with team and individuals added. Confirmation that the event was deleted, with undo.
Warning prompt when attempting to delete the event.
09 11
10
*Projects can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
Back to Start
09
10
11
OPTIONAL
22
Add & Delete ProjectDesktop Platform
Project’s home page.
Pop-up to create a new project.
01
02
*Calendar can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
01 02
OPTIONAL
23
Add & Delete ProjectDesktop Platform
Add a project name.
Add a project description.
03
04
*Calendar can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
03 04
OPTIONAL
24
Add & Delete ProjectDesktop Platform
Confirmation that a new project was created. Drop-down menu to add teams or individuals to the project.
Project details page, able to edit all details from here.
05 07
06
*Calendar can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
0506 07
25
Add & Delete ProjectDesktop Platform
Project detail page with a team and individuals added. Confirmation that the project was deleted, with undo.
Warning prompt when attempting to delete a project.
08 10
09
*Calendar can be accessed via the side menu at any time, so long as the menu is shown and there are no pop-ups or prompts that are in focus.
Back to Start
08
09
10
OPTIONAL
logandowell.com