Working as an experience designer at ZEISS Digital Innovation Partners and interacting on a daily basis with colleagues from business and engineering, it is essential to make ideas experienceable rapidly, iterate on feedback and bring products out to customers quickly. To reach this goal, we put our efforts into creating a working culture that fosters collaboration within the cross-functional teams focusing on exchange, knowledge sharing and mutual understanding.
This cross-functional team work requires the right mindset and culture, the right skillset and in addition the right toolset. This last element – having the right software – is an aspect that sometimes gets neglected, although it has a crucial influence on collaborations efficiency and effectiveness in our daily work. I recently experienced how the saying “a craftsman is only as good as his tools” turned out to be true within a specific design task. The software I am referring to is Webflow – an online tool for building and running websites that helps us solving a project challenge in a new way. Whether you’re woodworking or designing, the tools you choose shape the final product as well as the way to get there.
Of course, each tool has to fit the needs of the specific challenge. In this case, the brief came directly from the product users – who provided valuable feedback on the product APEER (www.apeer.com) – a cloud-based digital image processing platform that enables researchers and developers to collaborate. From the research conducted it became apparent that we could create a lot of value through a reworked landing page. In need of a flexible CMS system, we decided to use Webflow to enable designers to build a landing page quickly without requiring major developers’ resources.
At first sight, Webflow looks like a typical online website builder – but it is also very different than that. With the integrated CMS offering, it helps to facilitate marketing efforts and meet business objectives. In the “Designer” interface, designers can create the site structure and visual appearance with most flexibility, while collaborating with marketing colleagues who can fuel the pages with content through the “Editor”.
Webflow is also closely linked to the tech toolchain and can be used to develop and deploy the website directly. Their claim, to enable everyone to “code visually” is reflected in the “Designer” where you can add, position and style elements. At the same time, the underlying system automatically generates the necessary code in the background. Most design tools hide the complexity and core principles of the web medium. They make it simple for designers to draw boxes and shapes without thinking of responsiveness or web behaviour in the first place.
With Webflow, this is very different. Directly when creating elements, one has to think of their position and size almost as a web developer would do while translating designs into code. One has to understand the principles of nesting of elements and CSS classes since there is a one to one correlation between an action taken on the interface and a CSS or HTML change in the background. This way of working triggered a lot of discussions and exchange between designers and developers, which helped us to collaborate more closely. I still remember sitting together with a colleague from the development team explaining to me how the “flex-wrap” property affects the children of a flexbox element. This way, the tool helped us to speak the same language and greatly improved mutual understanding.
It should not be left unsaid that Webflow has a steeper learning curve than other design software. Even though designers are familiar with HTML and CSS basics, adding them as restrictions to a design process is a very different experience. The time it needs to get up to speed using the tool, however, is minor, since designers do not work on concepts but build the “real thing” and can therefore get it out to the customer quicker.
While our ambition stays the same to design and develop great solutions for our customers – always having superior customer experience in mind – the methods and toolsets continuously change and need to be adapted. Therefore, the most valuable skill is the ability to keep on learning. New technology enables ever better support, and we need to be able to make use of it.
Working in cross-functional teams and collaborating closely between design, tech and business forces us to speak the same language and to use tools that support our collaboration. The above-mentioned software is an excellent example for this fact. Technology, design and business moved closer together, as we reduced waste and the time needed to do coding. We could move fast, iterating quickly and therefore focus on the customer needs – all by using a really valuable tool. Other software is to come and to be explored, and we need to stay adaptable and open for tools that help us solve future challenges and to continue to work in cross-functional teams.
About Post Author
Leave a Reply