Webentwicklung, Frontend, Architect, UX Lead, Prozessoptimierung

4/2021 – 6/2021

At the GEC I established the design of the core product of the company. The Operations Center is the tool, that allows customers to access all services and do self-service and monitoring on their running cloud or onsite products. The goal was to abstract the technical process in a way, so that normal users could book cloud capacity for their projects without the need of having a lot of dev ops knowledge.

General
- Component based library in figma
- Documentation of the new design library and appoach
- Establishment of agile processes, i.e. review, hand-over, definition of readyness

Informationsdesign, Interactive design, Responsive Webdesign, Screen Design, Webdesign, Adobe After Effects, Adobe Creative Cloud, Adobe Creative Suite (CS), Confluence, Scrum, Interaction Design, Prototyping, User Experience (UX), User Interface (UI), Prozessmanagement, Adobe Illustrator, Adobe Photoshop, Agile Methodologie, Design Thinking, Figma, Jira

10/2020 – 4/2021

At EWE AG 2 tasks layed ahead: develop a react-native App for iOS and Android and develop a new Verison of the self-service portal for Osnatel (a EWE daughter) and also bring this new portal to EWE with a different branding

1. react-native iOS and Android App
The App gives the option to sign in with different users at the same to different areas of the service provider, like energy, tele communications, mobile or internet self-service portal. We had to handle a multitude of different login technologies and services. On the other hand a full fledge map component was needed, that offers different location based services.

UIUX research and design in regards to map component
OAuth2, SAML2, aws cognito and other service providers where used. The webviews are synced with their login state. Also for several logins we use multilogins - but not for all
Deliver an optimized app with high usage of native libraries and a small footprint
Component based architecture with react-native, react with functional components, redux with redux toolkit
Use a design token based system with tailwind configs
Multi-themeable for osnatel, EWE and other daughters.
One repo for multiple builds
CI CD with azure and appcenter for testing, deployment, rollout and development

2. osnatel and EWE self-service portal
General
Based on new technology like react, tailwind we develop a design token based component system and the self-service portal for osnal and EWE.

Responsive Webdesign, Webdesign, Android, iOS, Agile Methodologie, Confluence, Kanban (Softwareentwicklung), Apache Tomcat, Android Entwicklung, Apache Maven, Front End, Git, Jira, Mobile Application Development, Typescript, Xamarin, Xamarin Plattform, Xamarin.Android, Xamarin.Forms, Xamarin.iOS, Figma, User Experience (UX), User Interface (UI), HTML, HTML5, JavaScript, Json, JavaScript-Frameworks, Web Entwicklung, Microsoft Azure, React (JavaScript library), React Native

12/2019 – 10/2020

At solytic I faced several challanges. I tackled 3 core areas for a product that monitors and analyses solar panels from residental users to large scale solar power plants.

Processes
Architecture and development of core product
UXUI, Design and branding of core product


Lead Frontend, Frontend Architect

The core product of solytic has to get done new. Tasks ahead were
Architect an enterprise architecture for the new product ready to scale in regards to features, complexity and user base
Develop the first build with base components and example implementations of vuex with typesafty, apollo GraphQL with typesafty,
component architecture and SCSS based on atomic design pattern
Azure integration, complete build and deploy pipeline with integration of unit tests, code coverage and e2e tests
Document everything (processes, tech stack, DoD, DoR,...)
Hire team and prepare Onboarding and do onboarding
Establish agile processes and documentation
Apollo and GraphQL

Lead UXUI, Branding
As the product was only on the feature part planned and never been optimized in regards to UXUI we decided to challange the current state with an in-depth analysis and new ideas.

UX research, feature optimization and establishing of user centric design and approach in product development
New UXUI design from scratch
Component based library in figma
Atomic design pattern established, devs and product now also use atomic design pattern to structure code, project, stories and design.
Documentation of the new design library and appoach
Establishment of agile processes, i.e. review, hand-over, definition of readyness
Styleguide and brandguide

Adobe Creative Cloud, Adobe Creative Suite (CS), Agile Methodologie, Confluence, Continuous Delivery, CSS (Cascading Style Sheet), Datenanalyse, DevOps, DevOps (allg.), E-Commerce, Energiemarkt, Figma, Git, Graphql, HTML, HTML5, Informationsdesign, Interaction Design, Interactive design, Internet of Things (IoT), JavaScript, JavaScript-Frameworks, Json, Jira, Continuous Integration, Lean Prozesse, Lean Startup, Microsoft Azure, Postgresql, Projektmanagement (IT), Projektplanung / -vorbereitung, Prototyping, Prozessoptimierung, Requirement Analyse, Responsive Webdesign, Screen Design, Scrum, Sketch, Syntactically Awesome Stylesheets (Sass), Three.Js, Typescript, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Vue.Js, Web Entwicklung, Webdesign, WebGL (Web Graphics Library)

1/2019 – 11/2019

Frontend

Development of a credit card banking app for desktop

and mobile web with Angular. Update of the current Angular2 application. Architectural decisions, like stores, BEMIT and removal of ng-UI frameworks and libraries.



UXUI

Unified component approach for LBB, amazon and ADAC brand. Styleguide generation and UX and UI for desktop, mobile web and app design.

Adobe Creative Cloud, Agile Methodologie, Angular, AngularJS, Confluence, Docker, Figma, Fremdsprachenkorrespondent, Git, HTML, HTML5, Interaction Design, JavaScript, JavaScript-Frameworks, Jenkins, Kubernetes, Online-Banking, Prototyping, Responsive Webdesign, Screen Design, Scrum, SVG (Scalable Vector Graphics), Syntactically Awesome Stylesheets (Sass), Typescript, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Webdesign

7/2018 – 2/2019

Establishing a startup of DB with processmanagment, Lead Architekt Frontend, Lead UXUI, HR

General

Development of a transport management system with newest technolgies as we are pushing andpulling much data in realtime.



Processmanagement

Establishing agile processes, sprint definition, DoD and DoR, implementation of design thinking, documentation and coaching. Setup processes with JIRA, Confluence, Bitbucket, Buildpipelines and CircleCI for CI/CD



Lead UXUI

Design of the base style guide for desktop and mobile apps. Design of the desktop dispatch solution for transport planning and monitoring. Design of carrier/driver mobile apps with branded interfaces for IKEA, Puma and adidas. User testing and analytics regarding UX aspects. Definition of UX flows. UI Design for all apps.

Tools used in the process: sketch, Adobe CC, Flinto, Mockplus, Overflow, inVision



Lead Frontend

Evaluation of tech stacks for specific purposes of high demanding apps. Evaluated react, reactnative, vue.js, vue.js with nativescript and PWAs. After evaluation vue.js with native was choosen as a our tech stack. Vue.js was combined with nativescript and vertex.js for high performance. REST interfaces only for the open platform of weColli. Sockets for realtime data transmission. SASS with BEMIT for styling. HTML5 and PWA for desktop apps. Components in an own repo to modularize development. Implementation of two views for DT and mobile native in one app. So we could compile for web and native apps with one source.



Main technologies used: vue.js, vertex.js, SASS, BEMIT, HTML5, intelliJ, git, AWS, circleci.

Adobe Creative Cloud, Adobe Creative Suite (CS), Adobe Illustrator, Adobe Photoshop, Agile Methodologie, Confluence, Continuous Delivery, CSS (Cascading Style Sheet), DevOps, DevOps (allg.), Figma, Front End, Reactive Programming, Funktionale Programmierung, Git, HTML, HTML5, Informationsdesign, Interaction Design, Interactive design, JavaScript, JavaScript-Frameworks, Json, Jira, Kanban (Softwareentwicklung), Continuous Integration, Lean Prozesse, Lean Startup, Node.Js, Postgresql, Projektleitung / Teamleitung (IT), Projektmanagement - Konzeption / Vorgehensmodell, Projektmanagement (IT), Prototyping, Workflows, Prozessmanagement, Prozessoptimierung, React (JavaScript library), React Native, Responsive Webdesign, Screen Design, Scrum, Sketch, Speditionslogistik, Syntactically Awesome Stylesheets (Sass), Three.Js, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Vue.Js, Web Entwicklung, Webdesign, WebGL (Web Graphics Library)

4/2018 – 7/2018

General

Product- und Processmanagment, Frontend Lead und UX Lead (50 people Startup with 10 FE Devs und 3 UXUI)



Customer Experience

General Product- und Processmanagement
Scrum Process Refinement


Frontend Lead

Frontend Architecture
Angular with Redux, Bitbucket, Bamboo, Buildpipelines
Development of aSelf-Service Portals (Greenfield) with Angular
OAuth2 and securityconcept for attached BE services

UX Lead

Prozesse für UX/UI,
Brand Styleguide
UX Flows
UI Styleguide
Flinto, Sketch, Mockplus, InVision

Adobe Creative Suite (CS), Agile Methodologie, Angular, AngularJS, Confluence, Continuous Delivery, CSS (Cascading Style Sheet), Design Thinking, DevOps, DevOps (allg.), Digitale Transformation, Digitalisierung, Figma, Front End, Git, HTML, HTML5, Informationsdesign, Interaction Design, Interactive design, It-Beratung, JavaScript, JavaScript-Frameworks, Json, Jira, Kanban (Softwareentwicklung), Continuous Integration, Lean Startup, Mobile Application Development, Prototyping, Workflows, Prozessoptimierung, Responsive Webdesign, Screen Design, Sketch, Syntactically Awesome Stylesheets (Sass), Typescript, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Web Entwicklung, Sicherheit von Webanwendungen, Webdesign

4/2017 – 4/2018

Project S & I Germany and Financial Leasing in Europe

General

Develop a flexible user journey system, so we can offer service & inspection services with a base tech stack for 5 brands across 25 countries in the world. We started to programm custom web apps and ended with a JSON based schema, that described the journey and got delivered and deployed in the style guide of the brand. This included even custom journey changes, depending on legal information and different needs for different countries and markets. A unified style-guide was developed with a design system behind it. This could be used in the deployed web application as needed. A close colaboration with the VW UX Design team forvthe components helped us in the process.



Senior Frontend

Angular 5 SPA, Confluence, Buildpipelines, AWS, AWS Lambdas, Docker
Custom CSS lib for Audi
Brand based on Atomic Design pattern
node.js Microservice Development with express.js
Google Analytics, Adobe Analytics, HTML



Senior UXUI

Redesigning the financial service UX UI with an interface for 25 Markets globally with 5 brands of Volkswagen in each market in close communication with brands and markets. One HTML markup for all markets and brands, one journey definition as base journey.

Implementation of Design Thinking and process defintion for developers sprint and product/UX UI sprint
Sketch, Mockplus, Invision, Adobe CC, Bootstrap, HTML

Adobe Analytics, Adobe Creative Suite (CS), Adobe Illustrator, Adobe Photoshop, Agile Methodologie, Amazon Web Services (AWS), Angular, AngularJS, Balsamiq, Cloud (allg.), Confluence, Continuous Delivery, DevOps, DevOps (allg.), Docker, Extreme Programming, Figma, Front End, Reactive Programming, Funktionale Programmierung, Git, Google Analytics, Google Tag Manager, HTML, HTML5, Informationsdesign, Interaction Design, Interactive design, JavaScript, JavaScript-Frameworks, Json, Jira, Kanban (Softwareentwicklung), Continuous Integration, Mobile Application Development, Node.Js, Proof of Concept (POC), Prototyping, Workflows, Prozessoptimierung, React (JavaScript library), Responsive Webdesign, Screen Design, Scrum, Selenium, Sketch, SVG (Scalable Vector Graphics), Syntactically Awesome Stylesheets (Sass), Typescript, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Web Analytics, Web Entwicklung, Webdesign

9/2016 – 5/2017

Projekt eBay Trust n Safety
Frontenddevelopment
Componentdevelopment
Projectmanagement
SOY Templates

Projekt mobile.de New Journey for Car Reselling
Frontenddevelopment with react, redux, typescript and figma
Development of components for the new journey
Architecture for the technical foundation

Agile Methodologie, Confluence, Continuous Delivery, CSS (Cascading Style Sheet), DevOps, Extreme Programming, Figma, Git, HTML, HTML5, Interaction Design, JavaScript, JavaScript-Frameworks, Jira, Jquery, Kanban (Softwareentwicklung), Continuous Integration, Mobile Application Development, Node.Js, Prototyping, React (JavaScript library), Scrum, SQL, Typescript, Web Entwicklung

5/2016 – 9/2016

Develop and launch the new n24 Welt GmbH webpage with a focus on fastest time to render with content



Scala and scala play in the backend
Java
Typescript
Reactive Javascript framework
sketch

Agile Methodologie, Confluence, CSS (Cascading Style Sheet), Front End, Reactive Programming, Funktionale Programmierung, Git, HTML, HTML5, Java (allg.), JavaScript, JavaScript-Frameworks, Json, Jenkins, Jira, Node.Js, React (JavaScript library), Responsive Webdesign, Scala, Scrum, Selenium, Softwareentwicklung (allg.), SVG (Scalable Vector Graphics), Typescript, Web Entwicklung

4/2014 – 4/2016

Project News & Style
UI/UX
Ideation & concepts
Prototyping
Frontenddevelopment
Slider component development for zalando
Componentdevelopment
Management

Project myFeed/ Dein Zalando
UX Design
Concepts
UI Design
Frontenddevelopment
complete UXUIO redesign of zalando Startingpage with myFeed integration
First team before radical agility that tried out and did agile development in zalando
Backbone.js
Mustache


Project Wishlist
Concepts
UX/UI research
Frontend development
react, redux, typescript

Adobe Photoshop, Agile Methodologie, Amazon Web Services (AWS), Apache Maven, Betriebssysteme, Cloud (allg.), Continuous Delivery, CSS (Cascading Style Sheet), Design Thinking, DevOps, Docker, Front End, Reactive Programming, Funktionale Programmierung, Git, HTML5, Interaction Design, Java (allg.), JavaScript, JavaScript-Frameworks, Json, Jenkins, Jira, Jquery, Kanban (Softwareentwicklung), Continuous Integration, Mariadb, Mobile Application Development, Mongodb, Nginx, Node.Js, Postgresql, Prototyping, React (JavaScript library), Scala, Scrum, Sketch, SVG (Scalable Vector Graphics), Syntactically Awesome Stylesheets (Sass), Typescript, Usability Testing, User Experience (UX), User Interface (UI), Nutzerforschung, Web Entwicklung

3/2014 – 3/2016

Das neue Screendesign eines langjährigen Kunden. Ziel war es, eine Platform für ein aktives Marketing zu schaffen. Modernste Webtechnologien werden eingesetzt. Eine umfangreiche Vermarktung erfolgte.

Mysql, PHP, Adobe Illustrator, Adobe Photoshop, Content Management, Corporate Design, Corporate Identity, CSS (Cascading Style Sheet), Fotografieren, Hosting, HTML5, JavaScript, JavaScript-Frameworks, Json, Jquery, Marketing

1/2014 – 1/2016

Immobilienunternehmen geniesen trotz der Vielzahl an Leistungen einen schlechten Ruf in der Bevölkerung. Wir steuern dem entgegen! Ziel war es, ein endkundennahes und freundliches Image zu erzeugen. Dazu haben wir 3 Designs erstellt, die alle nicht den üblichen Hausdarstellungen entsprechen. Auch in der Farbwahl kam viel frische dazu. Immobilienberater mit Herz - gleichzeitig kommunizieren wir die vielen Dienstleistungen rund um Bautechnik und Immobilien auf der neuen Webseite und dem weiteren Werbematerial.

Mut, der sich bezahlt macht!

Content Management, Corporate Design, Corporate Identity, HTML5, JavaScript, JavaScript-Frameworks, Marketing, React (JavaScript library), Screen Design, Syntactically Awesome Stylesheets (Sass), User Experience (UX), User Interface (UI)

7/2011 – 1/2012

Bei der Firma RaySafe musste ein neues Screendesign erstellt werden. Das Design sollte Ruhe und High-Tech vermitteln. Ebenso wurde viel Wert auf eine einfache Bedienung für die Nutzer der Produkte gelegt. Hier finden die Anwender viele Informationen für den Einsatz und die Sicherheit beim Einsatz der radiologischen Produkte. Das Design wurde auch für den mobilen Einsatz optimiert.

Adobe Creative Suite (CS), Adobe Illustrator, Adobe Photoshop, CSS (Cascading Style Sheet), HTML5, JavaScript, Responsive Webdesign, Screen Design, User Experience (UX), User Interface (UI)

5/2010 – 2/2012

Entwicklung einer Webseite und einer Tabletanwendung für iOS und Android. Für Bauleiter wurde ein komplettes Verwaltungs- und Überwachungsfrontend entwickelt. Dieses ist direkt mit dem CRM verbunden. Dies ermöglicht Projektmanagement und Vertriebsanwendung im mobilen Einsatz bei gleichzeitigem Verzicht auf Aktenberge. Hierbei wurde von mir neben Design und Webentwicklung auch die Vertriebsoptimierung, Planung und Konzeption in enger Zusammenarbeit mit dem Kunden umgesetzt.

JavaScript, Json, JavaScript-Frameworks, Content Management, CRM (Customer Relationship Management), CSS (Cascading Style Sheet), Digitale Transformation, Digitalisierung, HTML5, Jquery, Marketing, Mysql, PHP, Responsive Webdesign, Screen Design, User Experience (UX), User Interface (UI)

1/2010 – 7/2010

Screendesign und Umsetzung mit einem CMS. Schnittstellen zur Bank entwickelt, um Auftragsdaten und Informationen unter Einhaltung aller Sicherheitsstandards zu übermitteln. Ebenso ist wieder ein CRM zum Ticketing und zur Bearbeitung von Kunden angebunden.

JavaScript-Frameworks, Content Management, CRM (Customer Relationship Management), CSS (Cascading Style Sheet), HTML5, JavaScript, Jquery, Mysql, PHP, Responsive Webdesign, Screen Design, User Experience (UX), User Interface (UI)

1/2008 – 7/2009

Positionierung der Marke am Markt mit neuem Werbekonzept, Corporate Design und einer Webseite.

Ich entwickelte dabei umfangreiche Schnittstellen zu SugarCRM mittels SOAP/REST. Ebenso eine Anbindung an verschiedene Immobilienportale sowohl an SugarCRM, wie auch an die Webseite.

Ziel war es Leads automatisiert zu verarbeiten und selbige zusammen mit Kunden optimal im CRM zu verwalten.

JavaScript, JavaScript-Frameworks, 3D Grafiken, Adobe Creative Suite (CS), Animationssoftware (allg.), Computeranimation / 3D Animation, Content Management, Corporate Design, Corporate Identity, CRM (Customer Relationship Management), CSS (Cascading Style Sheet), HTML5, Markendesign, Marketing, Mysql, PHP, Responsive Webdesign, Screen Design, User Experience (UX), User Interface (UI), Nutzerforschung

1/2007 – 6/2007

Für m&m's wurde eine neue Verpackung eingeführt. Mittels eines AdGames wurden die Verpackung im Rahmen einer Microsite beworben. Konzept, Design und Projektleitung in einem eigens ausgewählten Team. Das Basisdesign und Animationen entstanden dabei in Softimage. Ebenso wurden Microsites für die jeweiligen Spiele entwickelt. In einem europaweiten AdGame Wettbewerb belegte ein M&M Spiel den 2. Platz.

JavaScript, JavaScript-Frameworks, 3D-Game Designer, 3D Grafiken, Actionscript, Animationssoftware (allg.), Computeranimation / 3D Animation, HTML5, Responsive Webdesign, Screen Design, Spezialeffekte, User Experience (UX), User Interface (UI)

1/2006 – 7/2020

Neukonzeption des Auftritts der Firma. Komplette Umsetzung inkl. Webdesign und Industriekatalogen. Entwicklung einer eCommerce Platform. Erarbeitung einer ausgefeilten UI, um entsprechend die tausenden Industrieartikel leicht zugänglich zu präsentieren. Anbindung des ERP an den Shop mit Abgleich aller Stammdaten.

Corporate Design, Corporate Identity, CSS (Cascading Style Sheet), E-Commerce, JavaScript, JavaScript-Frameworks, Jquery, Marketing, Mysql, PHP, Responsive Webdesign, Screen Design, User Experience (UX), User Interface (UI)