contents … · web viewportfolio - steve pick 14/03/20185 contents contents1 design process2...

Portfolio - Steve Pick

Contents

Contents..........................................................................................................................................1

Design Process............................................................................................................................2

Application design - MYOB LiveAccounts payroll........................................................................2

Form design.................................................................................................................................9

iPad prototype............................................................................................................................12

Online loan application...............................................................................................................14

Discover - Contextual Enquiry...................................................................................................18

Discover - Analytics....................................................................................................................20

Define - Personas......................................................................................................................21

Develop - Mobile prototype........................................................................................................22

14/03/2018 1


Design Process

Application design - MYOB LiveAccounts payroll

Project

Design a payroll module for MYOB’s entry level online accounting software.

The target audience for the payroll system was small business owners just starting to have to

pay staff.

Process

Discover

Review competitor products

Review other internal MYOB payroll products

Read reports reviewing different payroll products

Interview MYOB staff around payroll, what worked, what didn’t

Install and test the primary competitors

14/03/2018 2


Define

MYOB already had a product in New Zealand which was losing market share to a competitor

product. The feedback was that the competing product was easier for people with no payroll

experience to use and successfully complete their first payroll.

Review of this product identified that it had copious help documentation at all stages of the

process.

Develop

Early paper screen designs to review with product owner and others

Balsamiq mockups

Usability testing of mockups

Deliver

Detailed Balsamiq mockups of all the screens with the flow between screens.

14/03/2018 3


Mockup

Early mockup of the employee details page and then final page.

14/03/2018 4


Finished page

14/03/2018 5


Help system

I introduced visible help on the right hand side of the screen. The goal was to provide a level of

comfort to inexperienced users. Often if information is not visible then it doesn’t exist. People are

often reluctant to read a system help system via ‘?’. There is also help at the top of each key

page to providing a quick overview. The user can minimise this when they are ready, and the

system remembers the state for next time. They can revisit the help via the ‘Show overview’ link

at the top right.

14/03/2018 6


Landing and main data entry page

The payroll landing page was design to be as simple as possible, and to remember your defaults

and last actions.

A. Set your payroll frequency and dates

B. Select who to pay

C. Start the pay run which involves adding the hours worked for each employee.

14/03/2018 7


14/03/2018 8


Form design

Toll Online consignment screen

The initial designs for the consignment screen were done before I joined Toll. It was done in

consultation with two business units who were the first to migrate to the new screens.

When we engaged with the next business units to be migrated we found they did not consider

the screen design suitable for their customers. They were quite strong in their objections.

Their primary requirement was that the form fit on one page.

Challenge

1. Find out exactly what design these business units required.

2. Try and negotiate and change in the screen design with the development team and

project managers.

Process

1. Review the business feedback and mockup new designs

a. Socialise the designs and iterate based on feedback

2. Review the new designs with the development team, and modify as required to achieve

the least cost/time outcome for the business

a. This process initially involved spending time convincing the team that the

requested change was worthwhile.

14/03/2018 9


Current screen

14/03/2018 10


Version 1

Version 2

14/03/2018 11


iPad prototype

GE ran some training on idea generation over a couple of months, with a focus on generating

ideas to improve the business. The training involved theory/ideation sessions and then actual

data gathering to generate and validate our ideas. At the end of the training each group

committed to try and test out one of their ideas.

My group chose to focus on improving the in-store loan application process.

Process

We visited stores to talk to sales people and back office staff about the current process

We spoke to GE staff from the relevant touch points to find out their thoughts on the

current process

Problem & Hypothesis

Problem: The loan application process takes about 30 mins, and for sales staff this is time that

they are not on the floor earning commissions.

There is also a high rejection rate, meaning they have to then investigate other means of finance,

and spend even more time.

Hypothesis: If we provide a quick and easy way to prequalify customers, the store staff will

spend less time on futile loan applications, and will be more likely to use our product.

Solution

Develop an iPad prototype for staff to use in store to prequalify customers.

Trial

The prototype was implemented in 2 stores to test out the idea with real staff and customers.

14/03/2018 12


iPad app

Earlier version

14/03/2018 13


Online loan application

Challenge

How to improve the GE loan application process in store.

When people make an interest free purchase at some retailers, the process involves applying for

a GE loan.

Approach

Understand the problem

We visited stores that use our software and spent time talking to them about the process

and what worked, what didn't.

Spoke to help desk staff about typical calls and problems they encountered

The product owner provided us with their perspective and goals.

Review the history of changes/requests for the current form.

Run a usability test with 5 people to gauge for ourselves how the system worked.

Mockup and test design ideas

My approach was to simplify the form visually, and make help text and hints visible as required, so that the user didn’t have to hunt for information, or guess, and ensure that the prompts/help text addressed the key problems that had been identified.

14/03/2018 14


Original

14/03/2018 15


Redesigned

Single column layout vertically aligned.

14/03/2018 16


Changes

Original page

New design

Show help when the field receive focus

Place prompt text at top of section in blue with red text

User Feedback

I didn't know you could enter 000's for a missing mobile number.

14/03/2018 17


Discover - Contextual Enquiry

At a customer site observing how they use our software.

The goal of contextual enquiry is to observe people using your software for their daily tasks, and

allow them to tell you about the good and the bad of the experience. You can also gain a lot of

insights just from watching how they interact with the software. Issues that they may not even be

conscious of can become apparent.

14/03/2018 18


Some of the tasks are done only once per year. They created these notes to help them with the

task next year.

14/03/2018 19


Discover - Analytics

Errors occurring in the last 30 days on our main data entry screen.

14/03/2018 20


Define - Personas

An example of a persona created for MYOB LiveAccounts. This was based on discussions and

site visits with a number of customers who used our product. It was designed primarily to

educate the development team. We actually got a couple of bookkeepers to visit and talk to the

dev team about their jobs, and how they used LiveAccounts.

14/03/2018 21


Develop - Mobile prototype

Stock take prototype

A simple jQuery prototype to test out a design for stock checking at dealers site.

14/03/2018 22

contents … · web viewportfolio - steve pick 14/03/20185 contents contents1 design process2...

Documents