Stacklet
Stacklet is an early-stage start-up, working on creating a platform providing cloud governance as code for large enterprises. As cloud adoption scales within organizations, they struggle to enforce governance policies that control usage, avoid potential breaches, and meet regulatory requirements while ensuring development productivity. Stacklet implements governance as code in the same way infrastructure is being managed as code today. It provides development and security engineering teams with an easy to use, standardized language for enforcing governance policies in large scale, dynamic cloud environments. The product is built on top of the open source project Cloud Custodian.
My role in Stacklet is a UX consultant, leading an external team of interaction and visual designers as well as supporting the Product team with creating the overall experience for all key personas - from the buyers through the users and maintainers of the platform.
THE JOURNEYStacklet is an early stage startup and there are a lot of brilliant ideas and trajectories the product could take on… but that means there are a lot of competing priorities and opportunities which makes my role even more exciting - I have the chance to influence and drive the strategy as well as the experience!
We have explored multiple of the possibilities in internal & external (customers as well as design partners) workshops and interviews led by me. Depending on the maturity of each idea and the type of feedback I and the team is looking for, I used everything from post-it notes (well virtual post-it notes because Stacklet is both completely remote and I try to be kind to the environment) to fully working demo versions
A FEW EXAMPLESearly explorationsOne of the main methods I have employed to aid conversations and ensure all abstract concepts translate to the same tangible views for everyone involved are rough, hand-drawn wireframes. They have enabled me to iterate extremely quickly through ideas, clearing the vision of engineering-heavy concepts for both myself and the rest of the team. Wireframes like this help participants feel at ease when providing feedback - a crucial part of quickly iterating an idea and coming up with what an MVP could look like.
Saying look like above is not quite correct. Most of the actual design is rarely very similar to these explorations. And that’s okay. They are there to suggest and prompt, to inform the vision, not necessarily to guide the specific visuals.
The examples on the side are the main screens for two key personas - a high-level overview of what the cloud costs and a deeply detailed view of a single resource & its JSON configuration.
flows, blueprints & information architecture
User & information flows are a common technique used to structure the overall vision of services and products, detailing the exact steps required to fulfil a task. When combined, especially for complicated products, they can form a service blueprint - including all the touchpoints a user has with both the software as well as any staff, documentation, or training. I use these techniques, at a varying level of detail during workshops with the C-suite as well as engineering teams. Depending on wether we want to crystallise the vision for the next quarter, when we use high-level abstract steps for the flow, or to figure out what the exact steps would be for someone to accomplish a task, from both data and interaction point of view - flows have helped me and the team speak the same language and not accidentally miss out any important steps.
All the flows inform the information architecture (IA) of the product. As Stacklet is still maturing, we have a chance to quickly test out new, better ways of organising information and flows to achieve the most natural, useful & usable experience.
user research & testingEveryone at Stacklet highly appreciates the importance of truly understanding the product’s users, their needs and requirements. We work closely with design partners and customers, as well as the many engineers who used to run c7n (the OSS offering on which Stacklet is built) to ensure we truly empathise with the real-life challenges of running cloud environments at scale and even more so - governing their use in terms of compliance, security, & cost. I conduct formal and informal interviews, think-aloud walk throughs, and workshops with various groups to learn and inform design decisions and features, and to validate designs.
pixel-perfect designIn order to ensure consistency when the team expands, as well as make the life of the front-end team easier, I drove the creation of a simple design system loosely based on material design. It covers all the building blocks of the interface, states, and interactions connected to them. Using and adapting the components speeds up both the design & the build process, and also enables other members of the product team to quickly mock up ideas.
Below are a few example screens of various parts of the application.
