iPhone with camera app displaying Markus Kison's portrait

Experience & Expertise

Profile

I build fast, maintainable websites and web applications that perform flawlessly on all devices.

With many years of experience in Berlin's creative coding community, I specialize in transforming your design templates into modern, responsive sites. Your designs are implemented with pixel-perfect accuracy and careful attention to detail. The result: lean, easy-to-maintain, custom-coded solutions—without costly page-builder subscriptions or intrusive cookie banners.

Tech stack & References

Selected Projects

Below you’ll find a selection of websites I have developed and currently maintain for my clients.

Over the years, I’ve built websites for individuals, companies, and institutions—sometimes working independently, other times as part of a larger team where I focus on specific components of bigger web applications. My tech stack integrates design tools for asset creation and design handoff (Figma, Adobe Creative Cloud), Visual Studio Code as my primary code editor, various CMS platforms (Kirby, WordPress, Webflow), and Tailwind as my preferred CSS framework. I use Parcel for bundling and rely on Three.js to create web-based 3D experiences. Occasionally, I also handle the web design process myself, ensuring a cohesive, end-to-end solution.

AniPad displaying a information graphic about the Berlin vote. SPD in the center and the number of occurrences for certain words in their election program
Icon visual studio code
Arrow down to the left bottom

My favorite code editor: Visual Studio Code

Icon javascript
Arrow down to the left bottom

Vanilla Javascript

Icon D3 framework
Arrow down to the left bottom

Using D3 for data visualization

Arrow down to the left bottom

Illustrator for assets

Icon jQuery

Using jQuery

Arrow down to the right bottom

Interactive infographic

Parteien in Zahlen

Icon chevron down

Design and implementation of an interactive illustration with scrolling effects for Berliner Morgenpost

Using the d3.js framework for data visualization, this website features also custom made scroll event handling using jQuery. Asset creation realised in Adobe Illustrator.

An iPad device displaying an interactive map of Europe on the welt website.
Icon Flourish tool
Arrow down to the left bottom

Built with Flourish, a tool for visualization
and animated data storytelling

Icon of Excel
Arrow down to the left bottom

Data preprocessing in Excel

Data visualization

welt.de

Icon chevron down

Design and realisation of interactive maps, charts & tables

For welt.de I am creating different data visualizations on a daily basis. Data preprocessing is handled in Excel or Google Tables eg. using Google Finance for real-time stock values.

Project website:

(Paywall)

A cookie icon

This visualization requires cookies. Accept?

An iPad displaying the welt.de website interface.
An iPhone with open safari browser displaying an empty website
A cookie icon

This visualization requires cookies. Accept?

IPhone with open welt website. The website is still empty.
A cookie icon

This visualization requires cookies. Accept?

An iPad displaying the welt.de website interface.
A cookie icon

This visualization requires cookies. Accept?

An iMac displaying the webdesign for 3punkt. Hero section with a large image of traffic signs and the sentence "don't walk where the road leads you..."
Icon visual studio code
Arrow down to the left bottom

My favorite code editor: Visual Studio Code

Icon html canvas
Arrow down to the left bottom

Html canvas animation

Icon javascript
Arrow down to the left bottom

Vanilla Javascript

Landing page

3punkt.de

Icon chevron down

Landing page design, implementation and hosting for Ulm based advertisement agency 3punkt.

Adaption of html template and integration of custom elements like html canvas animations and javascript elements. Asset preparation in Adobe CC.

Project website:

An iMac computer with a black screen
An iPhone displaying the responsive webdesign for 3Punkt's agency section
An iPhone displaying the 3Punkt webdesign
An iPad device displaying a white browser window
An iPad displaying the webdesign for developed application. Left side an image with clickable dots. Right side a form to enter the text which is displayed for each dot.
Icon visual studio code
Arrow down to the left bottom

My favorite code editor: Visual Studio Code

Icon javascript
Arrow down to the left bottom

Vanilla Javascript

Icon jQuery

Using jQuery

Arrow down to the right bottom

Web application

clickMapMaker

Icon chevron down

Development of a javascript based browser tool that allows graphic designers to create interactive images without coding.

After uploading a background image, users define areas of interest by placing markers onto the image. For each of these areas an info box is created into which users can enter a headline and additional information as well as an image. The interactive image is exported to a single html file and embedded into websites. The tool was used by designers working at welt.de to build interactive stock charts, maps and illustrations.

Tube system rendering realised in Cinema4D as part of my asset creation process.

Arrow down to the left bottom

Demo video

Arrow down to the left bottom

Exported interactive graphic

Arrow down to the left bottom

Try it !

The hero section for thePlanetDrum website. Displaying a group of people celebrating after a workshop
Icon Wordpress
Arrow down to the left bottom

Built in Wordpress

Icon Divi theme
Arrow down to the left bottom

Wordpress DIVI theme

Icon Podlove plugin
Arrow down to the left bottom

Podcast hosting using Podlove plugin

Icon Yoast SEO plugin
Arrow down to the left bottom

SEO optimization using Yoast plugin

Full-Service
Arrow down to the left bottom

Updates, hosting...

Website

thePlanetDrum.de

Icon chevron down

Webdesign & development of several website generations for Berlin’s largest private drum school

From a single Flash site in 2004 to three Wordpress sites in 2023, thePlanetDrum is a long term client of mine. Site-development is focussed on SEO with several subdomains incl. a podcast website. The website were realized using different Wordpress themes (JOYN, Divi) and include SEO optimization, hosting, legal administration, cookie integration and privacy control, backup, security, updates, email-setup, podcast hosting, asset preparation and optimization.

Project website:

An iPhone displaying the responsive webdesign for the drum website
The hero section for thePlanetDrum website. Displaying a group of people celebrating after a workshop
An iPhone mask to lay above a webdesign site
Webdesign for the thePlanetDrum. Structured rhythm of images and black and white sections.
An iPhone with Spotify App displaying the podcast site for thePlanetDrum
Arrow down to the left bottom

Publish to Spotify...

An iPad with Apple Podcasts app displaying the thePlanetDrum design
Arrow down to the left bottom

...and to Apple Podcasts

An iPad displaying the responsive webdesign for Berlin based artist Markus Kison. Clean typography black on white. Images with captions.
Icon visual studio code
Arrow down to the left bottom

My favorite code editor: Visual Studio Code

Icon javascript
Arrow down to the left bottom

Vanilla Javascript

Arrow down to the left bottom

Protoyping with Figma

design
Arrow down to the left bottom

Design w/ Figma

Portfolio website

markuskison.de

Icon chevron down

Fast artist portfolio website for (my) digital media art projects.

Project website:

An iPhone showing the responsive webdesign for markuskison.de. A clean website with typography at the top and a single image at the bottom.
Arrow down to the left bottom

Responsive grid alignment

Webdesign showcase. A clean Responsive webdesign for Berlin based artist Markus Kison: website with typography black on white and centered images. Similar to a weblog.
Responsive webdesign for Berlin based artist Markus Kison: Webdesign showcase. A clean website with typography black on white and centered images. Similar to a weblog.

Need a reliable developer to transform your design template into a modern website?

Email icon
Icon copy

Copy address to clipboard