The 6 Secrets for Creating Effective Application Layouts
Today, we’re going to talk about how to design an application that is easy to use and understand. In the book “Laws of UX: Using Psychology to Design Better Products & Services” by Jon Yablonski, it is mentioned that
“The most elegant design can fail if it forces users to conform to the design rather than working within the ‘blueprint’ of how humans perceive and process the world around them.”
The same mistake is very easy to make in data-driven designs, where application designers may be too focused on presenting data, grids, and charts, often overlooking the importance of an effective layout.
In the process of Modern Application Design, I have always believed that layout is the foundation of all designs. It’s like building a house. If you don’t first design the blueprint and flow of the house and randomly choose furniture, lighting, or flooring, you can quickly end up with a house that looks beautiful but is very strange to live in. Therefore, I have classified layout design into six key points, which I hope to share with BI designers and MicroStrategy users.
1. Create visual focus with an 80/20 rule
Although the 80/20 rule in Pareto’s Law represents “many outcomes, where roughly 80% of consequences come from 20% of causes (the “vital few”),” I like this kind of visual arrangement, especially when allocating the proportion of the navigation system and main content, we should try to focus on the navigation system that outlines the entire theme of the application, such as the company logo, branding, header, menu, and data source, in 20% of the screen. The main content, on the other hand, can occupy about 80% of the screen.
2. Define a user journey with the layout
When we apply the 80/20 rule to some great layout samples, we can find that there are two primary visual arrangements that dominate the user journey in application design. In the MicroStrategy dossier, you can mix the Freeform layout, Auto layout, and Vertical scrolling page in the Panel stack to achieve the desired effect.
3. Apply a common responsive layout
After years of use and evolution, mobile design has developed a set of browsing habits that almost everyone can quickly pick up. Casual replacement or display of “creativity” often leaves users feeling lost. Therefore, let us look at the most commonly used mobile layout types and choose the one that suits your user experience.
In addition, in the latest version of MicroStrategy Workstation, you can also choose to hide an entire Library toolbar and use the above approach to design a custom application.
4. Navigate analysis flow with visual elements
By utilizing visual effects, one can effectively guide the user’s analysis flow. For example, designing a large front panel can suggest that a more subtle analysis is located behind the darker panel. Using vertical scrolling pages and arrow shapes can guide the user step by step from top to bottom for a deep dive into data. Alternatively, you can use color blocks to make the user feel a strong connection between the menu and the content.
5. Process visual information more efficiently with grouping
A cluttered design can make people’s brains tired and unable to organize their thoughts. Different areas of our brains control different abilities, such as organization, sorting, logic, reading, comprehension, etc. To design a practical layout for conveying information, try to categorize and concentrate visual blocks as much as possible. For example, put sales-related data charts in one area, news information reading-related blocks in another, or place performance ranking in connected panels. In general, a visual layout should reduce visual blocks to five or fewer.
In Dossier, you can use Shapes, Panel stacks, or Freeform layout to design such blocks.
6. Design deep dive analysis in advance
While designing the layout, consider how to guide the user to explore helpful information layer by layer in data analysis. Deep Dive analysis allows users to make cross tabs with filters and data operations, allowing them to ask questions on the fly to make decisions.
In the Dossier application design process, we provide many different approaches. Depending on the nature of the data, consider putting filters in a Filter panel, or using an Information window to present various charts. You can also use Hypercards for instant insight. If there is a large amount of data that needs to be divided, consider using Contextual linking. If you consider these different methods in advance while designing the layout, it will create a smoother and more intuitive user experience.
Conclusion
In conclusion, effective application layout design is crucial to providing a positive user experience. By following the six secrets outlined in this article, designers can create a layout that is easy to understand and use. From creating visual focus to designing for deep dive analysis, each point plays an essential role in the overall success of the application. Additionally, designers should consider the user journey, apply a common responsive layout, navigate analysis flow with visuals, group related information, and design for deep dive analysis. By keeping these principles in mind, designers can ensure that their application is both visually appealing and user-friendly, leading to higher user engagement and satisfaction.
