New tools for a new era of digital product design
Almost 30 years after Sir Tim Berners-Lee invented the World Wide Web, and more than 20 years after SinnerSchrader was founded, product designers and product engineers still have to work with a pretty fragmented toolchain. At least until now. Let’s change the world of digital product design for the better!
To be honest, Alva doesn’t solve all problems at once. It’s more of a tool that, in classic UNIX-style, does one thing and does it well. And it integrates with other tools which, of course, do other things well. So what is Alva? It is a radically new digital design tool built for cross-functional product teams.
Alva lets you design interactive products based on the same components your engineers are using for production websites. Basically, Alva is design and engineering, joined together. As a designer, you start with a minimal set of web components which are enhanced by importing new components as placeholder images. Based on that, an engineer can start writing the component as real code and replace all the placeholder components.
Cross-functional single source of truth
Instead of creating a separate static UI kit for Sketch, Photoshop and all the other tools, you can start building your layouts and design with real coded components, that behave in the same way as the final application.
Basically, you share the component library with your engineers so that everyone has the latest version everywhere, every time. Currently Alva supports React and certain library requirements, but the goal is to be platform-agnostic in the future.
Bringing web technology into web design
A website is more than a plain fixed-size drawing canvas, where you can position rectangles, circles and text wherever you want to. Responsive design doesn’t mean to have just three different viewports designed. And interaction is not only connecting two static screens with a transition. It’s way more.
The story behind Alva
In today’s tool landscape, oldtimers like Photoshop and slightly newer tools like Sketch still play their roles. This means there are multiple sources of truth, making it hard to find out which truth is the real one. We try to design interactive products with static tools. „Even the most ‚advanced‘ digital
design tools are based on workflows for drawing mere pictures of interfaces,“ Facebook Product Designer Daniel Eden quips.
„Even the most ‚advanced‘ digital design tools are based on workflows for drawing mere pictures of interfaces.“
–Daniel Eden, Facebook Product Designer
To change that, Alva consumes component libraries to let users create complex compositions of real components. Those components can be built with a host of tools — e.g. patternplate, another tool by SinnerSchrader that helps users to create insightful and well-ordered design systems.
Alva’s mission is to put an end to static and sandboxed tools that create more problems in today’s environment than they solve. The overall goal is to bring concept, design and engineering closer together by linking them through a strong toolchain (of which Alva of course is just one of several tools). Product teams shall be liberated from many chores of maintenance to focus more on innovation instead.
This should mean less waste and less faults, lead to better products and bring more freedom for designers and engineers. Alva aims to enable
- friction-less design by bringing web technology into web design, and
- interactivity as the next dimension of visual interface design by instant prototyping.
But Alva’s mission goes way further. During the next months and years, the team wants to go for
- new ways of interaction beyond visual interface design, e.g. voice,
chat, gestures and facial expressions,
- complex, contextual design based on device data, user environment, preferences and behaviour,
- automated design by setting up the design system instead of specific screens, and
- the future of design through an entirely open architecture and open source code.
»Alva« is the middle name of Thomas Alva Edison, who made electricity available to the public. Alva started in August 2017 as an initiative at SinnerSchrader and since then a quite small, but very powerful cross-functional product design and engineering team is working hard on building and evolving the Alva app and its ecosystem. We learned a lot from the engineering world, where most of the tools and platforms are open source. That’s why we decided to make Alva entirely open source, too. To give something back to the community. At the time of this writing, you can download Alva for macOS, Windows and Linux as an early alpha version.