Touchscreen for bilateral advisory and independent research for Raiffeisen

In collaboration with iart interactive we developed the user interface of an interactive media table for Raiffeisen. The user interface's visual design specifically matches surrounding scenography and Raiffeisen's corporate identity. It is dynamically generated from the underlying content and reacts organically to the user's interactions.

Media Table

One-stop portal for publishing, discovering, and accessing organizational data products.

Data Portal

Data visualization of citizen's mobile network usage over time and location for the City of Geneva

Ville Vivante

Kanton Zürich

City of Winterthur

Stadt Zürich

Federal Chancellery FCh

Federal Electricity Commission ElCom

Federal Office for Agriculture FOAG

Federal Office for the Environment FOEN

Federal Office of Public Health FOPH

Federal Statistical Office FSO

German Chancellery

The German Federal Government works with us to make the insights gained from their citizen dialogue about the current state and future trends of wellbeing in Germany explorable for everyone.

German Federal Government

The Swiss Federal Government works with us to make open government data more accessible, understandable, and usable for everyone with a series of data applications, platforms, and publications.

Swiss Federal Government

The canton and city of Zürich work with us to serve their citizens with approachable, comprehensible, and practical information through a series of data applications, platforms, and publications.

Zürich

Together with our clients, we create engaging and meaningful interactions with their audience. We design and develop websites, applications, platforms, and publications with a digital-first, data-driven mindset. Our work comes to life on the web, on mobile devices, and in interactive installations.

We build tools and experiences for people.

Economy & Finance

Education & Research

Governance & Policy

Health & Fitness

Media & Culture

Progress & Equity

Systems & Standards

Data Application

Data Dashboard

Data Experience

Data Platform

Data Storytelling

Design System

Our design was eventually implemented by a third-party software engineering partner. To simplify the handover of the design specification and to ensure the quality of the implementation, we established a comprehensive design system. The system consists of a library of modular interface and visualization components as well as clear guidelines for interaction and behavior patterns. Catalog, our own tool for creating living style guides, gives the Augment design system a home.

Design system

The application measures data on four physical activities which contribute to the user’s overall health indicator. We designed dedicated views for each of these activities, allowing the user to drill-down into the data of each of these individually. The different views enable a self-directed analysis of statistical information and progression over time in addition to offering guided insights calculated by artificial intelligence. 

Deep dive into data

Assisting people to live a healthy lifestyle is something we value. We believe that data, when collected reliably and understood intuitively, can play a significant role in helping us understand our health choices. In our collaboration with Biovotion, we combined their technical expertise with our creativity to launch Augment, a mobile application that helps people make sense of their physical activity and aims to guide them to better health.

Knowing which activity to invest your time and effort is key to achieving your objectives and potential. We designed a simple representation of a user’s daily activity agenda. Intuitive and immediate, the design blossoms throughout the day providing goals and recommendations that are unique to each user’s personal needs.

Designed to reach goals

Augment helps people understand and act upon their medical data. Collected by Everion, a wearable device capable of measuring a wide range of health parameters, Augment provides a high-level overview of a user’s health status and presents personalized objectives in the form of daily goals.

Intuitive and actionable medical data

To generate sustainable outcomes for better personal health, we visualize a user’s movement, exercise, relaxation and sleep on different time scales: daily, weekly, and monthly. These three views foster an understanding of a user’s current health status as well as the long term impact of habits and behaviours.

Insights across dimensions and time scales

To promote positive behaviours, the Augment application enables users to identify and map decisions, as well as actions that are contributing to their health. This requires the study of many parameters in parallel. The timeline design allows detailed analysis without cognitive overload by combining all relevant information into one compact visualization.

Density without complexity

The design of the Augment application interface encourages the user to stay active and dynamic throughout the day. The fluid page transitions with subtle interactions mirror this goal by exciting the user with an energetic look and feel.

Visualization in motion

Measuring a wide range of parameters, the Augment application includes a comprehensive vital signs view, that provides the user with accurate insights. Each vital sign is represented as a card composed of real-time measurements, customizable time-series, and helpful statistics. By switching between the «live» and «24h» view, the focus shifts from a summary overview to a detailed, exploratory visualization.

Easy to scan, ready to explore

Vital signs. Medical grade. Anywhere. All the time. Biovotion's solutions connect patients and providers throughout the continuum of care. From primary to hospital and home care. Dedicated, disease specific solutions for better health outcomes.

Personal application to inform, motivate and empower people on their journey to better health for Biovotion

Augment

Our interface uses tailored messaging throughout the workout experience with the goal to provide the athletes with immediate feedback on their performance. In collaboration with Aurum, we defined the appropriate tone of voice to establish an honest and motivating writing style across the whole application.

Clear and motivating copy writing

To provide a consistent and cohesive experience for each target audience, we designed two separate interfaces: a «trainee» view for the athlete embedded into the workout machine and a «trainer» view to operate and monitor each phase of the workout session via a remote tablet.

Dual-screen workout experience

You compete against your own performance benchmark.

The inner ring shows your current performance, the outer ring shows your personal average.

<colored>Green</colored> means you perform better than your personal average.

<colored>Orange</colored> means that you have fallen below it.

The dot indicator shows the repetition cycle and provides an intuitive overview of the full exercise.

New personal bests are celebrated immediately.

In addition to our solutions for the workout machine and its various connected interfaces, we also designed and developed a fully responsive web application for athletes which provides access to a personal  performance dashboard, historical activities, account settings, and training schedules.

Comprehensive workout ecosystem

We helped Aurum create intuitive and engaging user interfaces, accompanying their newly developed computer-controlled, motorized workout machine. Our meticulously crafted visualization, evolves with time and reflects the amount of physical power applied to the helix machine. The visualization has to be intuitive and straightforward, in order to be readable under any condition, regardless of physical effort.

Highly optimized workout interface

On the dashboard, athletes can see their workout progress and peak powers. The main goal of the four designed visualization is to show a combination of progress overviews and specific performance data. Hence, patters of workout routines and strength development over time facts can be explored and evaluated for future exercises.

Explore your workout journey

What we call the «path of success» depicts the strongest performance across all exercises over time. The best result per exercise is visually highlighted and helps to identify patterns of how athletes perform. Ideally all bars increase over time to create a vertical path that visualizes the best performance in the latest workout.

Output by exercise

The peak power chart visualizes your max-strength per individual exercise and indicates if you already reached the optimal «bone growth» zone. Performing within the optimal zone helps to strengthen your bone structure and mitigate the risk of osteoporosis.

Peak power reference

The progress by exercise chart allows athletes to compare their performance between the first and the last workout, within a certain time frame. The focus is on the personal performance improvement per exercise. Ideally all bars show positive values and increase similarly over time.

Progress by exercise

The progress overall chart shows the overall performance from the first training to today. It helps to identify downturns or continuous progress over time. It summerises to overall output of all performed exercises of a regular Aurum training.

Progress overall

Aurum offers an innovative workout method using the newest technologies to provide a highly customized experience. Through a data-driven application, it aims to deploy maximal effect with minimal effort. We contributed to this workout experience by designing all digital touchpoints: the training screen, coach application, and athlete dashboard.

Data-driven interfaces and visualizations powering an isokinetic workout system.

Aurum

The Ava bracelet and application allows women to effortlessly track nine different physiological parameters. To transform the collected data into insights, we designed a new statistics and analysis page for the mobile application which includes compelling yet simple-to-read data visualizations.

Health data visualization for tracking cycle, fertility, and pregnancy

On four Sundays a year, the Swiss vote on federal, cantonal, and communal topics. The ballot dashboard we created for the Tamedia media group provides up-to-date information before, during, and after the vote. The administration interface allows the news editors to enter trends, projections, and the final results from various sources and push them to their audience in real-time.

Dashboard about the results of the Swiss popular votes for Tamedia

Ballot Dashboard

The Federal Statistical Office has the mandate of communicating statistical results to a wide audience in an easily understandable way. To help them present data effectively and consistently, we've developed a comprehensive design system for data visualization applicable across media channels like print, online, and television. The new system was published as a living documentation of design principles, design specifications, chart templates, and more.

Design system for creating effective and consistent charts for data analysis and data reporting for Federal Statistical Office

Data Visualization Guidelines

The Cancer Monitoring Dashboard is the authoritative source of information about the incidence and mortality of cancer in Switzerland. The website provides the general public with detailed insights about important parameters in epidemiology to understand and observe the occurrence and development of oncological diseases with a focus on readability, usability, and accessibility.

Dashboard about the incidence and mortality of cancer for the Federal Statistical Office

Cancer Monitoring Dashboard

The Child Penalty Atlas maps how the arrival of a child affects the careers of men and women across the globe. This exploratory data visualization developed for the Hub for Equal Representation in the Economy (H.E.R.) at the London School of Economics highlights the research insights in an intuitive and memorable manner. Users can search, browse, and compare the observed child penalty in employment and gender gap in employment across continents and countries worldwide.

Tracking the impact of parenthood on the careers of men and women around the world for H.E.R.

Child Penalty Atlas

Clusters are industry groups that play a significant role in Zurich's economy due to the high density of companies, research and educational institutions and professional organizations. By networking the players along the value chain, the Office of Economic and Labour Affairs of the Canton of Zurich aims to increase the innovative strength of the respective clusters as well as of the various clusters among themselves.

Data visualizations highlighting the economic significance of Zurich's industry clusters for Statistical Office Canton Zürich

Cluster Data

The Swisscom Cockpit gives their users detailed insights and full control over their costs when they use mobile data and make calls. We designed and implemented a responsive frontend that´s easy to use and accessible across all mobile devices.

Personal data management and analysis application for Swisscom

Cockpit

The exploratory network application we created for the Zurich University of Applied Science interconnects the competences available in the various institutes of the university. Competences are clustered into topics and subtopics allowing you to zoom from a bird's eye view down to the very details with ease.

Network visualization of research activity and competences for ZHAW

Competence Browser

The Competitiveness Datahub assists the six Western Balkan economies Albania, Bosnia and Herzegovina, Kosovo, Montenegro, North Macedonia, and Serbia in assessing and benchmarking their economic reforms and policies essential for competitiveness, enabling them to formulate better policies in response.

Data platform on Western Balkan economic competitiveness for OECD

Competitiveness Datahub

The platform hosts a wide variety of metrics including laboratory-confirmed cases, hospitalizations, deaths, number of tests, vaccinations, virus variants, and many more. The custom-made chart library was intentionally designed to be understood by a broad audience independent of their data literacy.

Building a modular chart library

The interactive data visualizations were specifically designed to emphasize the key aspects of each metric. Time series highlight trends over the course of the pandemic, heatmaps reveal patterns across demographic groups, and choropleth maps show densities across geographic regions.

Turning data into insights

The Covid-19 Dashboard is the authoritative source of information about the epidemiological situation in Switzerland. The platform provides a diverse audience with understandable insights about the pandemic in the form of interactive tables, charts, and maps with a focus on readability, usability, and accessibility.

Dashboard about the COVID-19 pandemic in Switzerland for the Federal Statistical Office

Covid-19 Dashboard

Our client CYP is committed to creating sustainable, effective continuing education and development solutions for their customers. To support their work, we designed and developed a user interface design system that adheres to the same standards of sustainability and efficiency. It allows them to evolve their products with ease and confidence.

Digital product design system for education, consulting, and innovation for CYP Association

CYP Design System

In addition to the end user interface, we created an admin portal that gives administrators and publishers full control over content, roles, and access. Workflows were intentionally designed to be modular and adjustable so that each team can work with processes that fit their needs while maintaining consistency across the organization.

Admin area to manage content, roles, and access

Our robust design system serves as the foundation for the organization's entire ecosystem of data publications. It defines the core design language, patterns, and components, making it easier to create new products and ensuring consistent, responsive experiences across all applications.

The search experience uses categories, keywords, and metadata to deliver precise and relevant results. We also introduced features for saving content in a personalized collection, and sharing them to support collaboration and knowledge exchange across teams.

Find, organize, share

We've built a centralized catalog that brings together dashboards, analyses, reports, and publications into a single, intuitive interface. Our work focused on making these data products easy to discover and accessible to everyone in the organization, turning previously scattered information into a cohesive experience.

Centralized Hub

We handled a wide range of technical complexity behind the scenes, from connecting external content to enabling publications, managing access control, and building reliable notification systems. We designed the underlying infrastructure so that this complexity stays invisible to users, resulting in a system that feels robust, reliable, and simple to navigate.

Robust technical infrastructure

We designed a multi-channel notification system that keeps teams aligned through in-app alerts, targeted emails, and integrated Slack messages, ensuring timely and relevant updates.

Multi-channel notification system

With our solutions, we improved efficiency by creating specific, optimized workflows tailored to user needs and internal processes, driving the standardization of procedures across the organization for diverse audiences, including business stakeholders, executives, data scientists, business intelligence, and support teams.

Improved and tailored processes

We expanded the Data Portal beyond indexing external content by supporting the content creation through a built-in publication workflow. The workflow introduces contributor, reviewer, and approver roles to clarify responsibilities and supports co-editing, commenting, change requests, explicit approvals, and auto-publication once everyone has signed off. With this solution we made it easier, faster, and safer to publish even sensitive content.

Efficient and collaborative publication flow

We helped the organization to

To address the complexity of managing access across many systems and products, we created a unified access management solution. We designed clear request and approval flows that help users obtain access quickly and give managers a single place to review, approve, or deny requests, promoting and enabling data governance standards. We complemented this with tools to monitor access to individual insights, controlling who can view them and who is notified when new content is published.

Unified access management

The Data Portal is a centralized hub for all data products created and curated across the organization. It empowers employees at every level to make informed, data-driven decisions. Users can access trusted data through an intuitive, efficient interface built for high performance and enterprise-grade security. By making data discovery and consumption more accessible, the portal helps teams — from business to engineering to marketing — effectively use organizational intelligence in their daily work.

Assigning the best fitting temporary workers to open job positions is a complex process for brokers of employment agencies. Dooly makes these tasks intuitive and efficient. We designed and developed a user interface design system to build a flexible and elegant information management platform.

Information management platform for temporary personnel placement for maverix

Dooly

The E-Cityplan panels located across the city of Zürich are here to help residents and visitors explore the area around them. A dynamic and interactive map is at the heart of this service in addition to a timetable for public transportation, event, local information, and emergency advice.

Information and navigation system helping people getting around the city of Zürich

E-Cityplan

The pilot housing project called Ecoplace in Zürich offers its residents sustainable living in a convenient environment. Using intelligent technology, the daily consumption of water, electricity and heat is tracked for every apartment. The reporting tool we designed and developed visualizes this data to give residents immediate feedback and motivates them to adjust their behavior – always with the goal to reduce consumption to a minimum.

Smart home dashboard to facilitate sustainable and mindful energy consumption for AXA

Ecoplace

This platform visualizes the current state of education for over 100 countries and enables you to look beyond the averages, see the disparities and identify which demographic groups are the most disadvantaged.

Data platform on deprivation and marginalisation in access to education for UNESCO

Education Inequalities

The Global Education Observatory is a gateway to education-related data. It builds on existing data from a range of sources, and gathers new information ensuring an exchange of information to improve the monitoring of SDG4 progress and relevant and emerging policy commitments.

Data platform to track and monitor SDG4 progress and commitments on quality education for all for UNESCO

Global Education Observatory

The online report «Education Progress» summarizes the key facts and trends in education around the world. It complements the information that is provided in the printed version of the Global Education Monitoring Report, the tool of the international community for the follow-up and review of progress towards a joint commitment.

Data-driven report telling the story behind education data from around the world for UNESCO

Education Progress

Every four years, Switzerland conducts elections to choose new representatives for both the National Council and the Council of States. The election dashboard we created for the Tamedia provides up-to-date information before, during, and after the elections. The administration interface allows the news editors to enter trends, projections, and the final results from various sources and push them to their audience in real-time.

Dashboard about the results of the Swiss federal elections for Tamedia

Election Dashboard

ElCom is responsible for monitoring prices and tariffs in the electricity sector in Switzerland. To support their mission, we've designed and developed a public information dashboard where policy-makers and consumers can analyse and compare electricity prices across cantons, municipalities, and network operators.

Detailed electricity price analysis of cantons, municipalities, and network operators for ElCom

Electricity Prices

Sharing knowledge through storytelling

A modular framework to create articles

Shaping the digital future of university collections

The ETH Library has an impressive and extensive archive of rare books and provides an infrastructure for the medium and long-term storage of digital data. To make these resources and services more accessible to the public we designed and developed Explora. This mobile-first website holds a series of carefully curated articles which are published by the ETH Library staff on a quarterly basis.

Publication for visual storytelling about scientific materials and topics for the ETH Library

Explora

Flynt's wealth management platform provides users with a holistic view of their wealth ecosystem. We helped to design and develop an initial version of the application, always with the goal to put the client in the center and to communicate even complex concepts in a simple an understandable way.

Digital wealth management platform connecting the dots of complex wealth structures

Flynt

Together with the Swiss newspaper Neue Zürcher Zeitung, we tell the story of people affected by the happenings in Fukushima in March 2011. We designed and implemented a media-rich reading experience that attempts to paint an accurate picture of the humanitarian situation two years after the triple catastrophe.

Long-form and data-driven report about the humanitarian crisis in Fukushima for NZZ

Fukushima

Within the scope of a research project by the University of St. Gallen we designed and developed an interactive atlas to discover the public value of Swiss and German organizations.

Data platform on the public value generated by organizations for the University of St.Gallen

Gemeinwohl Atlas

How We Visualized the 43 Indicators of OECD’s Going Digital Toolkit

You can learn more about the strategic thinking behind this chart system and how it was practically implemented in our making-of article by Luc Guillemot.

Read our article

The data underlying each of the 43 indicators included in the toolkit can be analyzed with detailed charts. But each data set offers unique opportunities and challenges for how to best visualize it. To provide the right chart with the right features for each indicator, we’ve built a modular chart system that’s consistent and scalable.

Custom-made chart system

Each country can be recognized and distinguished by its unique data portrait.

Data portraits of countries

The toolkit supports the “2019 Going Digital Synthesis Report” by making the quantitative and qualitative information visually explorable and comparable. The toolkit’s center piece, an interactive radial plot, provides an overview of the state of the digital transformation for all OECD countries and allows to put individual countries in perspective. Showing all countries as unified and equally important reflects OECD’s holistic and inclusive mindset.

Holistic and inclusive approach

The Going Digital Toolkit helps countries assess their state of digital development and formulate policy strategies and approaches in response. In collaboration with the OECD, we created an interactive data platform to visualize several indicators and link them to publications, policy guidances, and thematic ensembles.

An image with the name of the country selected: France

An image of all the indicators that looks like a wheel

An image of all the indicators that looks like a wheel, with tooltips

Data platform about digital transformation for the OECD

Going Digital Toolkit

Eight dimension of opportunities and risks of digital transformation such as jobs, trust, or innovation are included in the toolkit. A set of indicators within each dimension allows users to assess a country’s state of digital development. But digital transformation also cuts across many aspects of the economy and society. The themes are cross-dimensional entry points to the same indicators and focus on specific issues like skills, productivity, or gender. By providing non-linear and context-specific access to these indicators, the toolkit serves multiple use case with one interface.

Exploring data by dimension or theme

To celebrate the launch of the toolkit during the “OECD Going Digital Summit”, we’ve created a playful physical giveaway. The purpose of this analog wheel is to introduce the policy dimensions with their respective indicators to the public mimicking the functionality and behavior of its digital counterpart.

Bridging the media gap

Image showing devices with different screen sizes

To make the toolkit universally accessible, we optimized the design for all device categories. From small smartphones to large presentation screens. Our work didn’t stop with visually restructuring the content: each interaction and behavior was honed to create an effortless and delightful experience.

Fully responsive design

The Going Digital Toolkit helps countries assess their state of digital development and formulate policy strategies and approaches in response. In collaboration with the OECD we designed and developed an interactive data exploration portal that combines indicators, policy guidance, and publications.

Sector	Media
Product	Data Storytelling
Impact	Media & Culture
Release	January 2011

Media Table

Touchscreen for bilateral advisory and independent research for Raiffeisen

More Projects

Ville Vivante

Data Portal