OEG Best Practice: Top five design best practices for UX: Desktop and mobile

AnaplanOEG

Follow our UX team's recommendations and guidelines to leverage the UX to its fullest potential.

Desktop best practices

Our top five:

1. Minimize time to decision
2. Progressive disclosure
3. Smart grouping
4. Help and guide
5. Consistency

Minimize time-to-decision Focus on the outcome your users are attempting to arrive at and optimize for it. Prioritize key KPIs at the top of pages, or on landing pages Provide easy access to key reports and analysis tools Don’t overwhelm What decision are they trying to make? What will they do with that decision? How does this inform the pages and features needed?	Executive Summary Board
Progressive disclosure Presenting data incrementally avoids overwhelming users by keeping it simple upfront. Present data in simple, digestible chunks Allow users to drill into more detail by linking summary data in cards to detail data in worksheets Place useful items in “Additional Insights” Data-dense and busy pages can overwhelm non-experts; keep it simple by eliminating what’s not needed This is especially important on mobile as there’s even less real estate	Summary on a Board
Smart grouping Grouping helps the user to make sense of what they’re seeing. Group related data together in containers Use easy to understand categories Use text cards to provide headings if necessary Use smart grouping to improve the mobile experience	Smart Grouping
Help and guide Provide hints to guide users on what to do next. Use text and instructions where needed  Use text cards for pages intended for less frequent users Use tooltips for frequent users Provide custom tooltips to help describe visualizations Don’t overwhelm with verbose language	Board With Tooltips
Consistency Consistent design e.g. terms, colors, and layout makes the experience more predictable. Keep links and target page names consistent to avoid confusion Follow consistent naming conventions Use consistent colors and order for metrics	Do's & Don'ts

Mobile best practices

If your users are likely to be using your app regularly on mobile, think about the mobile experience first. Link cards to more detailed data to avoid overwhelming users Avoid displaying huge grids on boards On board pages, place text card headings across the entire page Use one page for web and mobile, to reduce duplication and maintenance

Desktop Board Page to Mobile

Author AJ Balsamo.
Contributing author Monica Girel.

egomez66

This is really good contents. Another thing I would advise is on mobile is to avoid images. As they take up so much space and no matter how small you make the image in the designer, it gets expanded in the mobile.