User Experience Designer
smartmockups_jmdfftri.jpg

Copy of PD Security Software

 

Background

Tasked to redevelop an NGO’s desktop app for the security sector over several months and dozens of iterations. They had been using a basic ‘skin’ from a windows IDE that needed a major overhaul to become more visually appealing and intuitive in the hopes to better sell to clients and gain government contracts. Seen below are the final concepts before they where exported into Windows forms and programed with Visual studio.

 
 

Concepts 1, 3, 6

 

Login

Condensing several preexisting sections led to the final version shown. It was decided that geolocation would be used to pull in the desired language and depending on whom signed it, a database storing privileges would grant new app access vs needed a separate standalone app they had been using; thus a single software install could be used for both training needs as well user management.

Iteration #8 as final design, pre translation into WinForms


 

Welcome

The Welcome screen (home) again condensed serval prior sections of the app into an all-in-one heads up info page. Room for spider chats, filters, contrast adjustment, gird or table view, ability to change language and room. breadcrumb navigation and more was all added after UX testing was conducted.


 

Earlier concept with chips for assigning training

 

Privileges

A hidden section added to give admins the power needed to deep dive into user progress and assign functions as needed. Adding a previously non-existent function, filtering by training type, was added with a tree view after UX research and testing was done.

Final design with tree view


 

Deep dive on progress

A running issue that needed solving was the ability to deep dive on progress and gate sections till prior ones had been finished, in addition to knowing where in the training the user was and able to reflect at a glance. The progress bar seen here was the fix to this. It become a persistent part of the app that would move from section to section, colors would display how well the user has chosen or what else needed to be solved and able to highlight to display prior questions. While the app was programmed in C#, it contained a small area that could show the bar coded in html/css.


 

Final results

 

Prepped app for sale in the internal market by developing a language reversible interface (reading left to right and vice versa)

 

Added functionality for more intuitive UX experiences requested by multiple project leads across multiple HCI disciplines

 

Resolved color blindness hotspots and maintained WCAG AAA UI standards for ADA needs

 

Developed new style guide with custom assets (icons, logos, graphics) for copyright ownership

 

Reduced developer work time by condensing multiple apps for admin functions into one single software platform

 

Assisted in winning multimillion dollar contract for software platform