The “OPS”, or Ontario Public Service, is a division of the Ontario provincial government, providing services directly to its citizens. To help fulfill that role, employees rely upon an internal web portal for ordering products and services... In essence, an internalized “Amazon” previously known as SODO (Service Order Desk Online).
Welcome to the (preliminary) page for all things “Phase 2” on this project. Samples and descriptions will be better organized very shortly. Thank you for your patience! I’m just getting this set up.
The “OPS”, or Ontario Public Service, is a division of the Ontario provincial government, providing services directly to its citizens. To help fulfill that role, employees rely upon an internal web portal for ordering products and services... In essence, an internalized “Amazon” previously known as SODO (Service Order Desk Online). After a decade of bolted-on features and unfocused functionality, I was brought aboard —via a one-year contract— to provide a ground-up redesign. My role, more specifically, has been to lead all aspects of UI and UX design and testing within a tight-knit team of managers and developers. We launched a limited first phase this summer and are in the planning stages for a winter v2 deployment. Bohemian Sketch, Adobe Illustrator, Adobe Photoshop and InVision prototype tools were used every day.
Insight Tarot represents a passion project of mine, and stems from a personal interest in divination, esoteric knowledge and ancient symbolism.
Having tested many mobile and desktop apps related to Tarot, iChing and the like, I started mapping out the app’s key features and how it could be monetized. With that foundation in hand, I began to block out all of the UX and testing it with users for refinement. Once I was happy with the overall direction, I started to build out the style guide and high-definition mocks for selling to potential investors / partners.
Some UI visual aspects are still in flux. And once development ramps up, I’ll be personally designing all 78 cards.
Some of the style guide docs produced
My previous employer, Genesys Labs, provides software support for call centre operations.
I was tasked with re-envisioning their key global dashboard product: Advisors. Advisors is used by Supervisors and Managers to monitor the performance of Agents on a global, regional, and one-by-one basis.
As Advisors is a flagship product of Genesys, much investigation was done before any sweeping updates would be made. One of the first large-scale redesign examinations I worked on was titled "Project Air".
Lifting cues from the latest style guide, the global table of call centres was overhauled for improved simplicity and navigation. Filters were added to help focus the table as needed. Secondary tables were replaced with visuals, customized to the Agent data being presented. Lastly, all alerts were duplicated into a global Alerts bar, sitting far right, so problems would never go unnoticed.
Further insight can be found inline with the visuals, below
The master table, a key element for selecting and monitoring the health of a call centre, was severely pinched in the original design. It now consumes most of the screen width. Global alerts, rather than being tucked away in a pop-up, now have a predominant position at far right. Secondary widgets along the bottom introduce some visual variety and now include a per-agent overview of status. Lastly, the rarely used Geo-location map is removed for the out-of-box setup, but it, along with other new widgets, can be added back in further down the screen.
My previous employer, Genesys Labs, provides software support for call centre operations.
At Genesys, we were not only involved in moving call centre software from on-premise to the web, we were constantly trying to push the envelope by getting dashboard notifications onto cutting-edge mobile platforms.
At bottom, I explored miniature widgets on the Samsung smartwatch, based closely on the Genesys dashboards / current UI.
At middle, I adapted Genesys widgets to Google Glass.
At top, working with the Motorola smartwatch, our KPI and Alert notificaions really began to tighten up.
To provide some context here, my previous employer, Genesys Labs, produces software which helps to track and analyze interactions between Agents and customers in large Call Centres. There are well over a dozen applications which aid, track and analyze those interactions. With a complexity of software, Genesys wanted to be responsive to their customers requests, so they set up an online feedback portal. When software issues come in as tickets (or cases), they are assigned to a Genesys Agent for prompt attention. Depending on various factors, a case could have a Low-1, Elevated-2 or Severe-3 rating, with the latter requiring the fastest response.
Unfortunately, Genesys lacked an easy mobile solution for their Agents to address these cases on the go.
In this example, we designed the software to support 3 personas - Genesys Agent, Genesys Supervisor and Genesys Customer
The customer would have access to a white-label version and be able to monitor and review all their own cases issued. Meanwhile, Genesys Agents would access the standard version, which provided access to all of the tickets they were currently working on. And lastly, Supervisors had full access to review and assume the role of any assigned agent.
The software features the ability to call or text chat with the other party.
Depending on your persona/role, some of the filtering options of the cases will change in the mobile application, but the ability to sort by priority is always available to the user.
Watch a mobile video demo below to see how cases are filtered and then accessed.
Working alongside creative teams, I provided leadership and design on all in-application icons for Blackberry 10 mobile OS (BB10). Over 1,500 icons were produced and managed.
Crosscut/Action Bar icons were shared globally between all applications, and accessed from common areas within the UI. Simple, flat and bold, these icons were easy to read without distracting from the rest of the on-screen content. 3rd party icons were also used in the Crosscut and Action Bar, but required us to match to 3rd party style requests (more illustrative and on-brand colours).
Emoticons were simultaneously designed for BB10 and BB7 (not shown) and matched to existing style guides under each instance.
Settings icons matched our flatter Crosscut style, but introduced colour, so as to distinguish themselves.
Genesys has created their first suite of advanced communication tools designed to enhance 3rd party websites. Referred to as "widgets", these features, such as Chat, can be accessed from a sidebar add-on.
Rather than examine the whole product in detail (we all know what chat is, and there's a detailed PDF deck for that) I'd rather focus on the addition of a new feature -- Adding a Send button to Chat
When I was assigned to the Genesys Widgets product, it was already underway with development from a base UI concept. My job, in several areas, was to further the UI and build UX flows for new features. In examination of the original specs, we (product, management and myself) felt that Chat was lacking a Send button, a feature of many popular chat apps.
Before any flows were built, I started by searching for any other chat applications we had, and reviewed 3rd party chat apps in detail. From there, several low and high fidelity flow documents were generated in Sketch. After careful review, the top prospects were turned into desktop and mobile interactive presentations using MarvelApp (similar to the equally popular InVision) and provided for user testing.
A custom set of emoticons designed for any/all forms of Genesys Chat application.
Prior to design work commencing, I examined many styles from the most popular chat applications, along with considerations of our own UI and past iconography I've been involved in, while working for Genesys.
A careful review of the most predominant emotional expressions across a broad range of chat applications was done, along with mapping all keyboard commands for invocation.
Genesys required an easy to use weekly appointment scheduler for mobile and desktop applications. Focus should emphasized towards the time blocks, and not a large calendar.
After careful review of existing calendar and scheduling capabilities within current Genesys products, and in consultation with the PM, other UX team members and development, I worked towards this final scheduling concept.
Customers can configure either a 5 day (work week) or 7 day (full week) day range as standard, or go to a maximum of 14 days.
Time increments for scheduling are expressed in blocks of 15 minutes. The minimum block increment would be 5 minutes, while the maximum is 1 hour.
When a day or time is no longer available due to another scheduling it, that item will auto-update and ghost out.
The desktop version has a bit more flexibility in time display. Customers can configure a tabbed AM/PM or Morning/Afternoon/Evening scenario, or disable time tabs, adding the AM PM designation to the end of the time display. Which scenario you choose tends to depend on the number of incremental times you plan to offer your customers.
Future scenarios may be designed to offer multiple bookings within the same time slots.
Genesys has produced many Voice-based UI plug-ins, customized for different types of Agent-related software. Regardless of the exact platform, the base voice functionality is similar... allow an Agent to call out and/or receive incoming voice calls from a customer, providing all interactive functionality and tracking of that call, whenever possible.
As Genesys moves into multi-channel support, voice-only focus is rather limiting. so a redesign of the various plugins, or bars, was requested.
The interaction bar we're looking at today was produced to plug into existing Oracle software, and can tie in to other areas of the primary app (not explored here today). Many of the changes made from the original design (bottom of page) are significant: I have added in multi-channel support, multi-status support, multi-interaction display, simplified/grouped controls (customized to each channel), and more.
In 2012, I designed and launched one of the first custom mobile-first responsive portfolio websites - paulgrantdesigns.com. Recently, I decided to retire the custom framework and port over to a Squarespace template, like GrantUX.com, for simplicity of management. To the credit of the original design, which is almost a decade old, the Squarespace template used today is not that dissimilar in layout and navigation.
As GrantUX charts my transformative march over the past decade into the world of UI, UX, CX, and Systems Design, “PGD”, as I sometimes call it, is an all-encompassing site, with a broader focus on my first previous 10 years in design. Those formative years charted a course that first started in branding and digital illustration. As my career progressed, I moved on to story boarding, email and microsite design… all of which then flowed into UI and eventually UX.
