top of page

360Score.Me

Redesign of a dashboard

hifi mockup 360Score.Me.png
360Score.Me needed an intuitive, user-friendly platform that monitors and manages workflow of anonymous peer evaluation surveys.  
My Goals
Redesign a complex, outdated survey management system into an intuitive, user-friendly platform.

Resolve critical usability and accessibility (508 compliance) issues.
MY ROLE
UX Designer
TARGET USER
Internal Stakeholders
COLLABORATORS
Developers & project managers
TIMELINE
Jun 2024 - Aug 2025

Previous Design Appearance

Previous Homepage:

24.jpg

Previous Step-wise survey set-up page:

25.jpg

Previous Employee Shout-Outs page:

26.jpg

Research Phase & Decisions

Methods Used: Critical Analysis of Legacy Design, Accessibility Audit, and Interaction Mapping.

Visual Design
The interface looks outdated, with misaligned elements, heavy grayscale, and inconsistent placement. Similar buttons share the same color, and typography choices cause confusion.
Efficiency through Automation
Pages lack a clear hierarchy, with disorganized layouts and inconsistent components. Navigation is unclear, making it hard for new users to understand where to go or what each page represents.
Visibility & Transparency
Not 508 compliant:  isn’t keyboard accessible, lacks alt text and screen‑reader support, uses poor color contrast and small text, and provides no labels or hover states to clarify interactive elements.
Sustainable UX Design
Same color for different functions, non-interactive dashboard elements, and no clear hierarchy.

 

Ideation

Discovery Method: I focused on a Dashboard-First approach to provide a "high-level view" of all survey workflows immediately upon login.

 

Narrowing Down: I prioritized three core pages for the redesign: the Dashboard (for management), Survey Setup (for functionality), and Employee Shout-Outs (for social engagement).

 

Tools: Figma, Canva, Trello, and Microsoft SharePoint.

Lo-fi Wireframes

360Score Wireframe.png
360Score Wireframe 2.png

My Redesign - Hifi Wireframes

Homepage (Wireframe):

Mockups (7).png

Response Rates page (Wireframe):

Mockups (8).png

Employee Shout-Outs page (Wireframe):

Mockups (9).png

My Redesign (Hi-fi)

hifi mockup 360Score.Me.png
Crohn's & Colitis Foundation Style Guide (1).png

Style guide to ensure design consistency and easier hand-off

Testing & Iterations

Issue Identified: Users mistook blue text for hyperlinks.

Changes Made:

  • Added hover states and clearer button color‑coding.

  • Replaced the messy manual setup with a step‑wise instructional guide.

Client Feedback Response:

  • Stakeholders wanted a more social feel, so I added filters and tags to the Shout‑Outs page to make peer interaction smoother.​

Reflections & Next Steps

What I learned: Improving the information hierarchy mattered more than updating colors. Reorganizing content turned a cluttered list of links into a usable management tool.

Next Steps:

  1. Convert wireframes into high‑fidelity prototypes.

  2. Run A/B tests to measure whether the step‑wise setup improves completion time.

  3. Conduct a mobile‑responsiveness audit, especially for the Shout‑Outs page.

  4. Explore adding real‑time analytics widgets to the homepage.

bottom of page