Stratio Big Data Platform
Definition and UI framework development
Client background
Major industries like healthcare, financial services and retail are leveraging the huge amounts of data they collect to analyze trends, reveal associations, and make critical decisions across a potentially large array of variables. The technologies behind harnessing this complex data are extremely powerful, and getting smarter by the day.
StratioDB is a start-up based in Madrid and Silicon Valley, that developes an advanced big data platform based on Spark technology that allows using any NoSQL database. The modules of the platform are aimed on simplicity of installation and use, speed, and without any dependency of suppliers.
The Challenge
Big data is complex and not everyone can understand the different systems that are in place to collect data from varied sources and to analyze them. In fact, much of this process may not be visually appealing because all that you’re going to see is tons and tons of data that mean nothing to anyone in that state. My goal was to improve the usefulness of the product, seeking clarity amidst complexity: the simpler we make our designs, the faster and easier it is for users to make decisions.
The Approach
Making two questions in every procedure:
- What is the user trying to do?
- How can UI help a user to achieve his or her objectives within the fewest possible steps?
The main objective was to to resolve complex processes and display relevant data in a visually appealing manner as more users from diverse backgrounds and needs are tapping into big data.
My Role
As a lead ux interface specialist, my job was to help define the Stratio products, and the creation from scratch of the UI, applying a common language of design to the entire platform. I developed a library of components for Axure and Sketch, styles guides, responsive grids, icons and interaction patterns, as a base for the open-source framework created by the front team.
Working under Scrum methodologies, I created predictable, simple and beautiful products that bridges the gap between non-technical experts and highly technical data analysts, aiming minimum perceived complexity.
The Process
- Research
Who are the users? What is the product? What are the goals?
Defining user experience opportunities and identifying use cases - Create early low-fi designs and get feedback
Rapidly iterate and launch follow-up usability tests, incorporating skateholders, developers, and product owners feedback into design revisions. - Iterate & test
Development of high fidelity & interactive prototypes (user test where possible). - Documentation
Creation of internal knowledge base for documents and findings as a reference for the team. - Implementation support
Bringing continuous support to the developers. - Framework development
In order to maximize productivity and consistency among the different modules, it was developed with the front team a common library of components.
Consistent design language
As we created design solutions, we had to be careful about maintaining a consistent design language across the entire platform. The fact that we had different product teams was another challenge, so communication was key to keeping everyone aligned and the project moving forward. It was very important the documentation through Axure prototypes and Zeplin styleguides with specs including highly-detailed annotations.
In order to align the UX team and make more consistent design solutions, I realized that we needed to establish our Product Design principles. This defines a set of values to help inform our work, and serve as another tool for decision-making during the design process.
After some months of analysis, several tests and iterations, the patterns that characterize the product became more evident, being summarized on this 10 key insights:
Stratio Product Design Principles
1. Agile
Use design solutions to make our product feel responsive and fast, reflecting our brand. Make it also easy and agile to build and maintain.
2. Keep it simple
Use streamlined interactions and comprehensive UI to bring focus and clarity to user’s core action and information. Making something simple to use is much harder -especially when the underlying systems are complex- but that’s the challenge of Stratio products.
3. Details matters
We are care about how our applications look and feel because attractive interfaces have an impact on perceived usability. When the UI has been polished and copywriting is absolutely clear (with context and zero ambiguity), it builds trust with users.
4. Prioritize data visualization
Stratio product is built around data. This must be reflected through interfaces with a focus on data legibility, with visual solutions like sparing use of bold and bright colours to get attention on data above a neutral background. Besides, use color coding to convey information quickly, that facilitates visual search.
5. Be consistent
Use interaction patterns, layout and typography in a consistent way, this helps with usability, and how users perceive the software (efficient and professional). Use whenever possible our framework components and patterns over specific module design element. Maximize productivity and consistency, sharing and reusing instead of reinventing the wheel every time. Use and maintain this cohesive system.
6. Give feedback
Implement feedback through notifications, alerts, options and other visual aids, either automatically or according to the user’s requests. Provides real-time notification of process status, it makes users feel in control and increase confidence that the task is proceeding and working as intended.
7. Modular
Design components and layouts with an awareness of all the use cases and places they may show up. Be aware of content dimensions and screen sizes.
8. Scalable
Design considering multiple scenarios. Value flexible, scalable solutions that can evolve easily with the content.
9. User-focused
Identify the people who will use the product, what they will use it for, and under what conditions they will use it. Our work should always reflect the product goals and users’ needs.
10. Data-driven approach
Let data drive decision-making, not assumptions. Keep doing that after designing, prototyping and testing with users and then iterating in response. Constantly validate your ideas.
The Discovery
Axure proved to be the best tool for this kind of product and the interactive prototypes were a powerful tool in creating transparency in the design process. Our what you see is what you get approach strengthened our relationship with our product owners and allowed me to gain feedback and approval from both our skateholders and development teams early on.
Designing for this product has given me invaluable experience in creating a design system that can be scalable and used in a wide variety of situations, and it has taught me a lot about the process and collaboration in an agile environment. It’s also given me a greater appreciation for the importance of a well-designed user interface in complex interactions.
Liked what you saw?