Click any image to enlarge view.
About the Project:
Date: February 2020
View Prototype: Administrator
View Prototype: Environments
About the Project: UL Technology needed a UX overhaul for their new credit card security testing application. My goal was to consolidate data into three user dashboards; allowing each user to visually digest lots of data quickly – and then take action in the least amount of steps. Here are a few of my wireframes designed to explain each user’s different data needs, how they would access it and then take action. A priority was to display test results dynamically and indicate which tests needed action first. Allowing users with different permissions to quickly see their action items on the dashboards as it relates to actions by other users. Consequently, this required working closely with product teams and users. Tasks were organized according to frequency, urgency, and other criteria.
Hypothesis: dashboards organize workflows and serve as the starting point for all tasks. Better data visualization reduces steps. Result: users work more efficiency and perform urgent tasks first that allow testing procedures to continue for other users
Screenshots
The Correlated Filter
Below is a more traditional wireframe of the feature enhancement for filtering. The Tester in this scenario would select one tile from a box and the other correlated tiles would load in the other boxes; each box can be manually refreshed and controlled independently, only when content tiles are selected will correlated tiles load in the category boxes. Double click opens item for management. I proposed a faster approach since the UI design patterns were established. By using high fidelity wireframes we eliminated mockups, separate testing prototypes and consolidated documentation during collaboration.
A Hi-Fi Wireframe
This project is an enterprise tool used by administrators to test POS and credit card terminal security. For these WFs, I used approved UI patterns instead of generic placeholders. Additionally, these decks were shared with stakeholders on InVision for commenting, approvals and more flexible collaboration. Stakeholders can follow the progress and check in on updates. Additionally, I will often create a prototype for more complex and/or innovative functionality. View InVision Examples
Tester’s Dashboard Hi-fi Wireframe
Dashboard for managing “Environments”
Environments were a new feature that required a prototype for testing. View prototype
Step process for creating environments
Feature management, one UI to do it all with stepped navigation and input masks: View Prototype
.
Whiteboard collaboration with product to refine features.
User Management. Removed this step and added to dashboard inline edits.
Whiteboard collaboration with product to refine features.
Whiteboard collaboration about UI