Rotate device for the best viewing experience.

Welcome to Bernhard's portfolio.
Try this:

Welcome, I am
Bernhard
a Design Technologist
a Front-End engineer
UI / UX focused
Openfor new opportunities

Adobe Spectrum is a comprehensive set of components, tools, and documentation that can help teams at Adobe create consistent, accessible, and user-friendly interfaces.

It is open-source and available for free.

I contributed to a variety of Spectrum features over the course of four years, with a particular focus on SVG generation and UI kits, Spectrum CSS, and the Spectrum documentation website.

Used by every designer at Adobe.

I was the lead engineer for the Spectrum SVG system, Adobe's most comprehensive UI collection in variants, scale, themes, and systems.

I managed 50+ automated UI kits and sticker sheets, and my codebase is implemented in the XD plugin and Figma plugin. I also extensively tested new color palettes with my visual regression tool to ensure consistency across Spectrums four color palettes.

We developed a special "Wireframe" color palette for easier mockup placement.

The standard CSS implementation of Adobe's design language.

During 2020 to 2023 I contributed accessible and scalable front-end code to various component implementations and migrations in Spectrum-CSS, powering the visual appearance of Adobe’s popular open-source libraries Spectrum React   and Spectrum Web Components.

If you click an Adobe button on the web it was surely made with some code I wrote.
View my GitHub contributions   to Spectrum-CSS.

I am proud of the work I did on the documentation website, and I believe that it is a valuable resource for anyone who wants to learn more about Spectrum or use it in their own work.

I built the Spectrum Icons page, the most visited feature page on the Spectrum Documentation website, enabling thousands of designers to search and place icons from our icon system.

In 2022, I collaborated with Nate Baldwin to research and implement new accessible colors for Adobe. We iterated on different options in our SVG library.

This NPM token package based Color Paletteenables our designers and engineers to quickly access our up-to-date palettes.

Powering Software through Design Systems

www.appdirect.com   ›  starting 2014

AppDirect

 

I develop & maintain the User Interface Framework (UIF) and our Style Guide "Base" and implement together with AppDirect's Engineers and Product Designers our visual vision.

I also launched various products for the AppDirect ecosystem, starting as a prototyper till the final front-end implementation.

Checkout out the Base Style Guide

5

Re-inventing Recommendations

www.luvocracy.com   ›  2012-2014    ›  Acquired by Walmart Labs

 

The responsive Catalog is the starting point to find products you may luv.

Luvocracy is a social shopping site described by Mashable as "Pinterest for people who actually want to buy stuff."

I helped grow the site from hundreds to hundreds of thousand of users by rapidly implementing front-end solutions including a responsive web framework and time-saving reusable components.

Building a catalog service with all kinds of cards drastically simplified the development. The concept was so successful that we decided to implement it across all platforms and devices.

Luvocracy got acquired by Walmart in July 2014.

7

All around Typography

A mix of UI elements I contributed to Fontshop's store.

I started at Fontshop International in July 2011 as a front-end developer at the office in Berlin, Germany and later in 2012 in San Francisco.

It was fascinating to work with a global team around all aspects of professional typography, web development and app development.

fontshop.com   ›  2009-2012

My favorite project was the "Random Fonts" page, a high-performance font discovery tool.

I independently designed and developed the feature. It works on all kinds of mobile devices as well.

The special work situation created amazing opportunities to collaborate together with typographers and developers from both company offices.

9

Empowering collaborative editing around the world

I worked as a summer intern at Wikia in 2010. The timing was ideal because a complete front and back-end redesign happened during my internship.

We used the latest front-end technology to convert elements into HTML 5 and CSS 3 with the help of SASS. Wikia‘s redesign was a great success story.

My implemented feature, the "Latest Photos", turned into one of the most popular features on the website.

One of my user experiments was the "User Interview for your Profile Page". Users were asked questions to populate their User Profile Pages.
wikia.com   ›  2010
"Oasis" - Wikia's new skin I worked on in 2010. Today it's still the foundation of a highly scalable wiki-platform that became one of the top US-websites.
11

Building an online place for community groups

Big Tent‘s web application provides a platform for community groups to organize and connect online.

My main focus was implementing and developing the user interface and user experience design.

The free platform is easy to use, but also provides powerful group management features and is completely customizable.

The site‘s revenue model is based on nonaggressive advertisement.

Buzz Pages

What I like about the Group Buzz page is that you can see all group activites compressed in one place. The simplistic layout makes it very easy to navigate through the content.

Public Profile Page

The Public Page was one of my favorite projects at Big Tent.

I like the idea of changing the large polaroid image based on the promoted "group of the week. " The admins can replace it with their own group image – it shows in a wonderful photographic way the variety of Big Tent‘s group life.

bigtent.com   ›  2007-2008
Buzz Pages present all group activities in one single view. Like a news feed.
I implemented BigTent's public page. The photo dynamically changed time to time.
13
Thank you