thebigappidea

[thebigappidea]

Lo-fi Prototype 2

The second lo-fi prototype was created based on the findings and feedback gathered from the initial prototype evaluations. All the issues identified in these evaluations should now be resolved, taking into account the user's expectations further. 

Based on the feedback received, the 'free time' screen has been completely re-designed to provide a richer interface that should now be more useful to the user. Content throughout the prototype has been structured more appropriately to enable better smoothness of the interaction process. The steps in the interaction process have also been simplified to improve the flow of the app. As a whole the prototype should now be far more intuitive to use, helping to fit into different mobile contexts.

Other than step 3 of the scenario which relates to the free time screen, the same scenario as the first lo-fi prototype will be used in the evaluation process. For step 3 a new simpler task has been made. This is because the old one (viewing a breakdown of free time), has already been accomplished by the new interface designed.

The Scenario:

Add an 'iCal' timetable to the application

Book to work on your ID assignment for 2 hours in an available time slot

View your free time for today

Add a free time notification that will go off at 9am everyday

The Prototype:

[thebigappidea]

Prototype Evaluation 2

The second evaluation of the lo-fi prototype was completed by a third year student studying at the University of the West of England. This student was a close match to the persona created for the app, improving the validity of the results found. As with the first study, an evaluation summary sheet was used.  

View the prototype evaluation in PDF format. 

Like the first evaluation, this revealed some minor issues relating to misleading actions, in particular the 'sync' and 'manual' option of the 'add timetable' screen. By having the word 'sync' this implies that the user already has something to sync, causing confusion on whether to choose this option or not.

Other potential design flaws, as well as missing functionality were identified in the 'free time' screen. The user assumed they could book tasks in this screen, however there was no functionality currently in place for this. The time of each free time slot was also missing in this screen. This made it almost pointless to the user, as there is no context involved.

From completing both evaluation studies it is clear that we've still got a lot of refinements to make before the app is even close to the high-fidelity stage. Currently it appears that there is no succinct or intuitive way to complete each aspect of the app, causing quite a lot of confusion for the user. 

The issues identified will all be resolved in the next lo-fi prototype made, as part of the iterative design process.

[thebigappidea]

Prototype Evaluation 1

The first evaluation of the lo-fi prototype was completed during one of our scheduled workshop sessions. An evaluation summary sheet was used to capture any observations relating to problems the user had with the app. Each problem identified was then evaluated, with a proposed change and implementation being made. 

View the prototype evaluation in PDF format.

The outcome of this evaluation revealed some minor problems such as inconsistent or incorrect naming of elements, as well as some major problems relating to the smoothness of the interaction process. This evaluation study proved to be extremely useful, as from this it was clear that the content included had not been appropriately structured to match the user's expectations.

[thebigappidea]

Lo-fi Prototype 1

At this stage of the project my team member and I came together, combining both aspects of the app we had been working on to produce the first lo-fi prototype. All of our initial designs were laid out and analysed collaboratively, taking different features that worked well from each. These were then transformed and combined into one single consistent design used for the lo-fi prototype. 

The scenario below will be used to evaluate the prototype with real intended users, as part of the next stage of the UCD process.

The Scenario:

Add an 'iCal' timetable to the application

Book to work on your ID assignment for 2 hours in an available time slot

View a breakdown of the individual free time slots you have

Add a free time notification that will go off at 9am everyday

The Prototype:

[thebigappidea]

Functional Requirements

Specifying functional requirements is an extremely important part of the-centred design process. Unfortunately we learnt this the hard way. To elaborate, after we had created our initial designs we found that as a team we were going off track not really knowing what needed to be included in the app, nor did we have a clear idea on the flow of it. As a result of this, we spent hours trying to create a lo-fi that would work, but were finding ourselves just designing and not really knowing why or what for. From discussing this problem in a workshop with our tutor, we then realised we had missed out this crucial stage!

We looked back at the  Initial requirements of the app based on the insights from the requirements gathering stage (B1). From doing so we then used these to create the all important functional requirements to include in the app.  These are as follows:

Schedule Screen:

Colour coded interface

Differentiate between free time and other tasks/ activities

Show current time

Book tasks/ activities in free time slots

assignment work, exam revision, general activities

Duration time

Task name and info if not specified

Daily or weekly view

Free time Screen

View free time available

see your daily free time

see your current time

Manage Screen

Sync existing timetable

Sync iCal, Google Calendar etc.

Add deadline

exam deadline, assignment deadline

title, info, date

Notifications

Notification added by student

free time, assignment deadlines or exam dates

Reminder date, time

example: Good morning, you have 4 hours of free time today! What would you like to do with this time?”

Books task/ cancel

These functional requirements will be used along with the initial designs created to make the first low-fidelity prototype.

Valuable lesson learnt: stick to that UCD process!

[thebigappidea]

Task to Abstract Component

Following on from the initial designs a tast to abstract component was made. This helps to understand the user's intentions, and in order to fulfil these intentions, the responsibilities and components that app must include. This is based on the persona and scenario created in the analysis phase of the project.

View the Task to Abstract Component in PDF format. 

[thebigappidea]

Initial Designs

After creating storyboards, the next stage of the design phase was to create some initial design ideas. These were drawn on life size Android template paper, to better envision what the designs will look like. As the design space is restricted to a mobile size, this forced me to take into account Androids mobile user interace guidelines. I used the guidelines to understand where different features should be placed, such as the navigation bar, based on design norms and expectations. 

A simplified scenario was used for these initial designs that was constantly referred to throughout the initial design process. This ensured that the designs made successfully accomplished the scenario.

The Scenario:

To book a 2 hour time slot to complete assignment work, based on the free time you hace available.

Initial Design 1:

The first 3 screens show the schedule aspect of the app. The schedule can be viewed by day or week, with filter options to only show specific activities or free time. Each activity bubble can be clicked on to add/edit/delete an activity.

As you can see the user has filtered by free time and selected the 1:30 - 3:30 free time slot to book.

The next 3 screens show the time slot booking process, providing the user with an option to select the activity they would like to book. These have been split up based on common activities identified in the requirements gathering stage. As the design demonstrates, the user has selected the assignment option and now has to choose the assignment they would like to work on. Various important options are then specified and the user completes the booking.

The final screen of this initial design shows the updated schedule with the booked assignment work included.

Initial Design 2:

This design takes a completely different approach to successfully achieve the same scenario. Rather than using the schedule screen, this design focusses on the free time screen, completing the booking through this. A notification feature has also been designed to encourage the user to book free time. 

Screen 1 displays a notification of the amount of free time the user has available today. Once the 'book task' button has been clicked it takes the user directly to screen 2. This shows the free time the user, has split into AM and PM. The white parts on the clocks indicate free time, and the remaining colours indicate different activities. Activities can be booked in free time slots by clicking on the desired slot. Screen 3 shows the time slot booking screen using the same clock feature to indicate the amount of time you want to book the activity for. Once the assignment item has been clicked on, this expands to reveal all the user's assignments. An assignment is then selected and hitting save completes the booking.

The final screen shows a totally different design of the schedule page. I've decided to experiment with a kind of diary look and feel, whilst still displaying the tasks the user has for the day. Different days can be viewed by swiping either left or right to turn the interactive page. Colour shades have again been used to differentiate between the different activities. As you can see the newly added assignment activity is included in the schedule, successfully completing the scenario.

These designs, along with my team member's, will be explored and built on collaboratively to produce the first low-fidelity prototype. 

[thebigappidea]

Design Concepts and Mobile Usability Guidelines

Class Workshop - week 4

  Design Concepts

During this workshop different design concepts were explored that must be considered when creating the designs of the app. These are summarised below:

The physical:

The buttons etc. How users interact with the information.

The psychological:

How does the user feel about the engagement? - Are they motivated, encouraged etc.

The cognitive:

Will the user know and understand what to do? - Purely at a usability level. 

The metaphorical (not always needed):

A representation of an idea. For example -  folders and files in the real world relating to folders used on a Windows computer.

  Mobile Usability Guidelines

The other half of the workshop was all about mobile usability guidelines. This was extremely useful to me, as designing for mobile was not something I had previously done before.

We watched a presentation by Jonathan Stark that was all about the principles of mobile interface design. This helped to understand all the different considerations involved in mobile design such as mobile contexts, user control guidelines, gestures, navigation models etc. From watching this presentation, the notes made will help me to make important design decisions when creating the UI for the app.

If you're unfamiliar with mobile design this presentation is definitely worth a watch!

[thebigappidea]

Storyboards

The next stage of the project, as part of the design phase, was to create storyboards illustrating what the interface does and how it is used to accomplish tasks in a real usage scenario. Two storyboards were created based on the persona made. The aim of these were to clearly demonstrate:

Who the user is

The usage situation

The user's motivations for using the interface

Any problems the application may solve

Storyboard 1:

This storyboard is all about a person who is having a hard time dealing with stress, due to university assignments mounting up. The illustrations show the usefulness of the app being used as an organisation tool, reducing the stress on the person by helping to manage deadlines.

Storyboard 2:

This storyboard is about a person who struggles to manage his free time effectively. It illustrates the the usefulness of a notifications feature, reminding the person to complete a task to earn rewards. This helps for the person to not feel guilty when engaging in an activity, as sufficient work would have been completed before hand. 

Outcome of storyboards:

User stress and time constraints means the app must be kept simple.

Users need to feel like they can take part in other activities without feeling guilty that they should be doing work.

Users need to be notified of upcoming tasks.

Free time must be easily accesible to view, as and when a user needs it.

Processes like adding assignment deadlines and booking time slots must be quick and intuitive to encourage re-use of the application. 

The learning points defined will be used in the next stage to create initial design concepts.

[thebigappidea]

Contextual Design

Class Workshop - week 3

Adopting a contextual design process is the best way to interpret the entire design process from start to finish. During this workshop we looked at contextual design principles, as well as 3 different work models. These were created to capture the tasks of individuals in diagrams, based around the app. This helped to provide 3 different perspectives on how tasks are completed. It also helped identify different, detailed aspects of interaction, as well as any possible problems that could arise with the app.

Flow Model

This model was created to show how someone interacts and communicates with the app. It starts to reveal possible areas of friction, and explores the other areas around the app that may not have been thought of. It also helps to unearth and reveal things that may not have been considered through informal communication.

Cultural Model

This model captures the policy, issues and governance on how something is done. For the target audience of the app this relates to part-time jobs, other assignments, loans to pay-off etc. It is to do with different aspects that restrict what they can do, and what people's roles, responsibilities, constraints and pressures are. 

Sequence Model

This model reveals any strategies to complete the task and any problems along the way. The task selected for this model was to find out the user's working schedule. Creating this model helped to show the different strategies people use, the intents or goals of each step taken during the task, and the problems getting in their way.

From completing these models, this has helped in understanding the vision for the app. This includes its system, delivery and support structures to make it successful.

[thebigappidea]

Scenario Creation

After creating a persona, a scenario was created to express an imagined situation of the app's use. 

"Scenarios are prototypes built with words"

This will be used throughout the design process in various ways such as: 

To develop ideas and functions

For scripts for user evaluations of prototypes

For concrete examples of tasks

View the scenario in PDF format.

    note: The other team member in my group has also created a persona and scenario. My persona focuses on a character seeking organisation assistance, whilst the other persona focuses on a well organised character looking for a portable time-management device. The scenarios are based around these personas, helping to cater for different areas of the application, as well as different intended users of it. 

[thebigappidea]

Persona Creation

A persona was created as part of the analysis phase to consider the type of student who might use the app. This was made to be as realistic and as close to the real intended user as possible. Creating a persona will help to understand the user’s goals, motivations and characteristics. It also represents behaviour patterns, helping to understand the flow of the user’s day and how the interface will fit into it. 

View the persona in PDF format.

[thebigappidea]

Competitor Analysis

A competitor analysis was conducted as part of the analysis phase to review similar apps that already exist. This helped to gain an understanding on the competition that is already out there. It also provided insight into how the app could be designed to better suite its target audience, making it stand-out above its competitors. 

View the competitor analysis in PDF format.

[thebigappidea]

Announcing Scheduled!

This is the brand new name for our app!

We thought it was about time we gave the BIG app idea a name, so after brainstorming a few ideas we narrowed it down to 'Plan A', 'Scheduled', 'Don't Panic', 'Time Crisis' and 'Organize'. These were all based on key words taken from the envisioned concept of the app. 

We hope you like it!

[thebigappidea]

Aim of the app

From defining the concept in the previous workshop, a key aim of the app was created:

To improve time management by encouraging students to schedule free time effectively.

This will be referred to constantly throughout the project to ensure the sole aim is being considered throughout every stage of the app design and development. 

[thebigappidea]

Analysis Phase

Class Workshop - week 2

This workshop was all about understanding the context by reviewing notes from the initial requirements gathering stage, as well as reflecting on key insights and corresponding requirements that have been found during this stage. 

After completing this initial brainstorming session, a concept planning guide was created to develop the ideas found. The guide was aimed to trigger thoughts about different aspects of our ideas and develop these into something we could work with and base a project around. 

The Project

Who is it for?

This service is for students on any year of study, in any degree discipline. International students are included, so multiple language barriers will be considered. Information will not be shared between students, with information being specific to each user of the app.

What is it for?

To improve time management

To provide suitable rest times between student working hours

To encourage students to schedule free time effectively

Aims/ Interactivity

Allow students to define working hours they have left personally, taking away other activites in their day. The app will require a list of activities to be entered, as well as estimated completion times. Once this has been entered a clear colour coded interface will display the amount of free time a student has each day. Notifications can also be set, for example “Good morning, you have 4 hours free time today!”.

Activities can be synced with ical or other calendar services.

Ability to enter additional activities not included in their calendar, such as going to the gym.

Enter assignment deadlines and estimated assignment completion time in hours.

  A summary was then drawn up and a short 1 minute presentation was given to the class. Please see the summary below: 

[thebigappidea]

Project Definition

To design and develop an app that will help students manage one or more aspects of their academic work, more effectively. 

Findings from the previous requirements gathering stage will be drawn on, where key insights were identified and translated into specific functional and non-functional requirements.

This blog will document the design and development phase of the app, adopting a user-centered design process throughout.

Aim

The aim of this project is to deliver a well-considered design, which is grounded in interaction design research. The app will enable illustration of the core functionality and interactivity as defined by the specified requirements.