SONAR Market Dashboard

Design Problem

The SONAR user interface had significant usability and performance issues due to an outdated, cluttered design lacking a cohesive visual identity, style guide, or grid system. This resulted in non-standardized UI elements, making navigation difficult and increasing task completion times. Legacy code caused slow loading and poor performance, while the lack of responsive design hindered accessibility across devices like tablets and smaller screens. A complete redesign was needed, focusing on standardization, modernized code, and responsive design to improve user experience and accessibility.

User Research

During the research phase, the team conducted remote interviews with seven users over four days, using a script with 32 open-ended questions to understand user values, motivations, and routines. These insights guided the design process. Key findings included: users wanted rates (both All-In Rate and Rate Per Mile) to be the primary focus of the page, not the map, which was slowing load times. Many users also favored the design approach of GreenScreensAI.

Competitive Analysis

The comparison of FreightWaves SONAR, DAT Load Board, and Greenscreens.ai highlights key differences:

Data Accuracy and Timeliness

All platforms provide real-time data, but variations in data sources and update frequencies may affect insight precision.

User Experience

DAT Load Board is considered easier to use, while Greenscreens.ai offers a simple, clean, and navigable interface. SONAR’s interface is less intuitive, as noted in prior user feedback.

Integration Capabilities

Greenscreens.ai and DAT provide robust integration options to streamline workflows, while SONAR also supports integrations (e.g., with TMS/ERP systems).

Specialization

Greenscreens.ai focuses on dynamic pricing, DAT offers a wide range of freight services, and SONAR specializes in market forecasting and analytics.

Wireframes

Wireframes for the FreightWaves SONAR redesign were developed using insights from customer interviews and competitive analysis, focusing on user needs and industry best practices. Key changes included:

Prioritizing rates over the map to align with user decision-making needs, enhancing usability.

Reducing the map's prominence to improve page load times while keeping it as a supporting feature.

Adding options to view both All-In Rate and Rate Per Mile for greater flexibility.

Drawing inspiration from GreenScreensAI’s intuitive design to streamline navigation and modernize the interface for a user-friendly, visually appealing experience.

Usability Testing

Usability testing for the FreightWaves SONAR redesign involved creating a high-fidelity Figma prototype and conducting seven usability tests (four initial, three follow-up) with shippers, brokers, and carriers. Issues identified and solutions implemented include:

1. Issue: Users wanted clarity on SPOT Rate calculations. Solution: Added a tooltip explaining the rate calculation.

2. Issue: Users needed margin calculations for contract rates alongside TRAC Spot rates. Solution: Added a UI selector to calculate margins using All-In Rate or Rate Per Mile.

3. Issue: Users wanted today’s and week-over-week HAUL Index data. Solution: Included this data in Today’s Lane Insights.

4. Issue: Users wanted to delete all saved lanes at once. Solution: Added a bulk delete feature to the Saved Lanes widget.