PREVENT WEB APP
ROLE: UX RESEARCHER; UX DESIGNER
CONTEXT
The goal was to develop a new prevention tool to improve outage detection, accelerate the time to remediation, and yield significant cost savings for the organization.
USER STORY
As an IT lead responsible for ensuring system reliability and performance, I need a tool that accurately detects outages and provides real-time data so that I can quickly address and resolve issues, thereby minimizing downtime and reducing operational costs.
OUTCOME
Improved Outage Detection: The new prevention tool improved outage detection by 350%, significantly enhancing the firm's ability to respond to issues quickly.
Cost Savings: The tool resulted in $866,000 in annual savings for a global financial firm, demonstrating the financial viability and efficiency of the new system.
TOOLS: Figma; Sketch; Google Analytics
METHODS: Sketching; Personas; Storyboard; Information Architecture; Wireframes; Rapid Prototyping; Interaction Design; User Interface Design; Usability Testing; Interviews; Quantitative and Qualitative Data Collection and Analysis
DESIGN PROCESS
PHASE I. Discovery
Research & Analysis: Conducted user research using a range of quantitative and qualitative methods: interviews, focus groups, surveys, ethnographic observation, and workflow tasks to gather insights on user needs and behaviors.
Competitive Analysis: Analyzed competitors to identify best practices and areas for differentiation.
Stakeholder Interviews: Engaged with stakeholders to understand business goals, technical constraints, and project requirements.
PHASE II. Definition
User Personas: Developed detailed user personas to represent key user groups and their goals.
User Scenarios & Journey Mapping: Created user scenarios and journey maps to visualize user interactions and identify pain points.
Requirements Gathering: Defined project requirements, including functional and non-functional specifications.
Figure 1. Initial sketches of a user flow for Prevent tool
PHASE III. Ideation
Brainstorming: Conducted brainstorming sessions to generate a wide range of ideas and solutions.
Sketching & Low-Fidelity Wireframes: Created initial sketches and low-fidelity wireframes to outline the basic structure and layout of the interface.
Concept Testing: Tested initial concepts with users to gather feedback and iterate on designs.
PHASE IV. Design
Information Architecture: Developed site maps, task flows, and information architecture diagrams to structure and organize content.
High-Fidelity Wireframes & Mockups: Created detailed high-fidelity wireframes and mockups to define the visual design and user interface.
Interactive Prototyping: Built interactive prototypes to simulate the tool’s functionality and gather user feedback.
Figure 2. Interactive prototype for testing concepts
PHASE V. Validation
Usability Testing: Conduct usability tests to evaluate the design’s effectiveness and identify areas for improvement.
A/B Testing: Perform A/B tests to compare different design iterations and determine the most effective solution.
Feedback Integration: Iterate on the design based on user feedback and testing results, ensuring the tool meets user expectations and requirements.
PHASE VI. Development
Collaboration with Developers: Work closely with developers to ensure the design is implemented accurately and efficiently.
Design Handoff: Provide detailed design specifications and assets to developers for implementation.
Front-End Performance Optimization: Ensure the front-end performance of UX designs is optimized.
Figure 3. Hi-fiidelity prototype of Prevent’s Environment Overview page
Figure 4. Hi-fiidelity prototype of Prevent’s Issue Summary page
PHASE VII. Launch
Final Testing & QA: Conduct final testing and quality assurance checks to ensure the product is ready for launch.
Launch & Rollout: Coordinate with the product and marketing teams to plan and execute the product launch.
PHASE VIII. Post-Launch
Monitoring & Analytics: Monitor user behavior and gather analytics to assess the product’s performance.
Continuous Improvement: Continuously iterate on the design based on user feedback and evolving needs.
Maintenance: Provide ongoing support and maintenance to ensure the product remains functional and effective.