Process
The first task of this project was to understand the lead designer's initial work. Taking their original mobile drafts - finalizing them - and then converting them to Tablet and Desktop. The majority of the research including interviews, surveys, and competitor analysis was completed prior to me joining the project. This was the starting point for me.
I researched the best practices at the time for designing mobile-first and how from here to create fully responsive designs. The PWA was built on the ionic framework.
Please note, much of this content is under NDA so only specific screens can be shown - also no previous work from other designers can be displayed.
Pay Report - Home
Pay Report or the home screen acts as a dashboard for airline staff to check recent schedule-based earnings. During onboarding, the user selected which statistics appealed most to them, these appear as flexbox cards at the top of the page. From this page, the user can deep-dive into flight specifics by selecting each activity. There are 4 levels of information per activity.
Pay Statements
Pay statements enable the user to have a single-page overview of earnings and reasoning for a single month. Other functionality within this page is to export to CSV & PDF along with sharing functionality on mobile and tablet devices.
Statistics
This page was designed and developed to allow users to see all their relative statistics at a weekly, monthly, and annual glance. The user could also set a custom date range. The statistics page was designed to be highly customizable to fit the changing needs of each user.
By default, the preferred stats to display were decided during onboarding. The user can choose to see this as a Barchart or Piechart. The user can choose for the information to be displayed by activity or month - with three levels of information. The statistics page can also lead the user directly back to the relative activity within Pay Report.
Archive
The archive is simply a collection of all older scheduled activities. This was designed to allow the user to go back and ensure all things went as expected or to raise a query with a previous activity. This is organised by Year and Schedule/Month (Airline Based)
Settings
As said before the user decides their preferred statistics during onboarding. The settings page is where the user can come back to change this. With this, the user can also set reminders and edit notification settings.
Another crucial setting added to CrewPay was to allow the user to select which times they would prefer to see. This can either be the local airport, their own base airport or again Universal Zulu time. This enables the staff to decipher the changing timezones with ease.
More
The More tab is a useful bank of information and contacts. This page includes code glossaries, FAQs, and contacts relative to the staff member. This also includes more information about their profile and working history. (This page cannot be displayed.) Finally if the user ever needs to, this is where they navigate to log out.
Messaging
Messaging or Queries was a complex page to design. This was due to the varying requirements of each airline. During the research, I gathered the top queries from participating airlines, these were used as the base for general subject lines, while also providing an 'Other' option.
Another assist depends on where the query was raised the user would receive a different UI. If a query is raised at the activity level they receive activity specific suggested subjects. Otherwise if raised simply from the messages tab they are presented with Top rated and Search related FAQs.
Login/Onboarding
Like most introduction screens the user is able to log in, there was no registration involved in this process.
On the first login, the user is presented with two sections - to choose their preferred statistics and some other content. Secondly, they are shown the option to take the app tour. The user is forced to go through the first 4 steps of the tour and is then given the option to leave or continue the tour.
This app tour can be found and used again at any time from the 'More' section.
