The Brief
Introduce a concept for the next generation of Sage One employee management and payroll software. Identify the key user needs, based on the given scenario, consider a number of features and solutions, then determine which are the most desirable to users.
The solution should be fresh thinking and get the most from the latest technology and combine multiple features into a central, easy to use service. It should work for both an employer and employee perspective. The solution could be an app, website, a physical computing solution or any of these combined.
The Solution
During our research phase, through the heavy amount of user testing and identification of user needs we produced a mobile application that used the Sage guidelines.
We introduced a series of features that meant a business owner didn’t have to spend a large amount of time on managing the frustrating part of their business such as managing their staff and keeping track of which employee is paid and how much they have been paid.
As the brief also mentioned that the app could be used as both an employee and employer. We interviewed and did user testing for both employees and employers, we identified key user needs and problems with the current platform that Sage offer.
Working In A Team
In this project, we had constantly met and spoke with the Sage One department to discuss our development through the project.
Working in a team on this project really developed my skills as a designer, creating a mobile application for the public using a large amount of user testing helped us significantly to produce something that met the scenario that we were set.
Our Plan
Our general plan for this project was to constantly get user feedback and testing to then create a user-centred design that would be as beneficial to the end user as possible.
We started by doing a series of crazy 8s, once we had done a series of designs down that we like the look of, we started working on simple solutions to identify the major user needs that came from our user testing.
Using paper prototyping with our user testing group, we found that the business owners would constantly want to spend the least amount of time doing these tasks; as they had small businesses, they would want to spend the least amount of time having to manage employees and focus on running their business.
Design Development
Basic mockup - (Left) - A basic layout for our first design of the staff page, we wanted to have a portrait of the staff member that the user would be trying to see for easy recognition of the staff.
More detailed layout - (Middle Left) - Increased size of portraits, reducing the size of buttons to clear screen clutter. A more organised layout with a slider.
A more designed layout - (Middle Right) - Creating a more organised and increased size of the list in general. Moving the add staff button to the bottom as the scenario states that the staff won’t be any more than 15.
Final Design - (Right) - The final design of our staff page, we wanted to keep it as accessible as possible. We changed to a grid design which can accommodate more staff on the screen making it more obvious who the staff are.
Design Problems
A problem that we came across was the general design problem of using the Sage guidelines, creating an app that complied with guidelines was hard as all of their products were similar in design. We managed to get across our goals of keeping the app as smooth as possible for the employer mainly and having the employee side of the app simple.
Final Designs
Main menu for employer - (Left) - This is the main menu for the employer, it includes the most relevant sections of the app that a user would want access to.
Main menu for employee - (Middle Left) - This is the main menu for the employee’s section of the app, The app will recognise the employee is a part of a company and tailor the content to that company.
Employer profile - (Middle Right) - This is the screen shown when the employer presses their photo on the main menu, containing information on their details registered on the account.
Employer “Sage Code” - (Right) - The “Sage Code” is the feature to reduce time to add an employee to the company’s staff, the employer scans an employee’s unique Sage Code then the employee will be given information to fill out for their profile.
Rota Management
Available Shifts - (Left) - This is shown to employees about which shifts are available to them, through the apps compatibility with other applications such as the calendar, users will be able to see which shifts they will be able to apply for.
My Shifts (Employee) - (Middle Left) - The app will work in compatibility with the calendar app so that users will be able to see which shifts they work swiftly, including potentially a widget for Android devices.
Rota - (Middle Right) - If the user selects a certain day on the calendar, where a shift may be available. here, two shifts are available and when pressing on another employees name then the option to swap shifts becomes available.
SnapCode - (Right) - Here an employer is adding an employee to their staff list using the Sage Code feature, once the employee has been added, the employee is required to fill in a section of information regarding their details for the job.
Staff and Payroll
Staff Page - (Left) - This staff page is visible on both sides of the application; main interaction features such as adding employees via the Sage Code and accessing information such as payslips is restricted to employers.
Staff Page (Employer) - (Middle Left) - The employer’s view of the employee’s profile from the staff page. From here they can do potential tasks such as contacting them as they would have provided contact details when they submitted their details to the company.
Employee Payslip - (Middle Right) - This is what is shown once the employer pressed on to the “pay employee” button, there are details shown on which shifts they have worked the selected month.
Paid Employee - (Right) - Once the employer has verified that they want to play that person through an external security system via the employer bank account.