
### Pirates don't share, pirates sharrr.

[Sharrr](https://sharrr.com) enables end-to-end encrypted file transfers. This project serves as a proof of concept for securely transferring virtually unlimited file sizes over the internet.

Read the [technical documentation](https://sharrr.com/about) for more information.

![Sharrr](/static/images/posts/media/sharrr/screenshot.png)

![Sharrr Mobile](/static/images/posts/media/sharrr/screenshot-mobile.png)


Sharrr


Scrt.link allows you to securely share sensitive information online. Avoid sharing confidential details via email, Slack, Teams, WhatsApp, or other communication channels. A one-time, disposable link ensures your secrets are accessed only once before being permanently destroyed.

Check it out: [scrt.link](https://www.scrt.link).

## Impressions

![ScrtLink](/static/images/posts/media/scrt-link/scrt-link-1.png)
![ScrtLink](/static/images/posts/media/scrt-link/scrt-link-2.png)


scrt.link


Due to an outdated tech stack and unmaintained dependencies, we decided to rebuild denkmal.org from the ground up. As part of this process, we also redesigned the frontend to provide users with not only a fresh look but, more importantly, an improved user experience. A significant change was relocating the main navigation to the bottom of the screen on mobile devices. This update significantly enhanced usability for our mobile users, who account for over 80% of our audience.

Alongside minor UI enhancements, we introduced a global navigation, a streamlined event submission form, and a dark mode. For the frontend framework, we selected [Nuxt.js](https://nuxtjs.org)."

Check it out: [Denkmal.org](https://www.denkmal.org).

## Impressions

![Denkmal](/static/images/posts/media/denkmal-2/website-mobile-day.png)
![Denkmal](/static/images/posts/media/denkmal-2/website-mobile-night.png)
![Denkmal](/static/images/posts/media/denkmal-2/website-mobile-tsri-day.png)
![Denkmal](/static/images/posts/media/denkmal-2/website-mobile-tsri-night.png)


Denkmal.org 2.0


Front-end development and UI design for an award winning car insurance web-app. With the app you could take you a picture of your vehicle registration document and get the right car insurance in return.

## Screenshots

![Simpego Snap](/static/images/posts/media/simpego-snap/website-mobile.png)

## Technology

- Nuxt.js
- Vue
- Netlify


Simpego Snap


Denkmalmit ist the organisation behind Denkmal.org, the event calendar for Basel's night life. [denkmalmit.org](https://denkmalmit.org).

## Screenshots

![Denkmalmit](/static/images/posts/media/denkmalmit/website.png)
![Denkmalmit](/static/images/posts/media/denkmalmit/website-mobile.png)

## Technology

- Illustrator
- Vue.js
- Nuxt.js
- Zeit now


Denkmalmit


Corporate Re-Design for cometas. The e-learning full-service agency cometas creates digital courses, web- and mobile software. [cometas.ch](https://www.cometas.ch).

## Final logo

![Cometas](/static/images/posts/media/cometas/cometas-logo-large.png)

## Before and after

![Cometas](/static/images/posts/media/cometas/cometas-redesign.png)

## Technology

- Illustrator


Cometas


Corporate Design for SANTiHANS GmbH, the agency I founded. [santihans.com](https://www.santihans.com).

## Webdesign

![SANTiHANS](/static/images/posts/media/santihans/website-index.png)
![SANTiHANS](/static/images/posts/media/santihans/website-index-1.png)
![SANTiHANS](/static/images/posts/media/santihans/website-index-2.png)
![SANTiHANS](/static/images/posts/media/santihans/website-blog.png)
![SANTiHANS](/static/images/posts/media/santihans/website-mobile.png)

## Technology

- Nuxt.js
- Netlify


SANTiHANS


Redesign for Denkmal Graz launch. [Denkmal.org](https://www.denkmal.org).

## Webdesign

![Denkmal](/static/images/posts/media/denkmal/Denkmal-App.jpg)

## Print

![Denkmal](/static/images/posts/media/denkmal/Denkmal-Postcard.jpg)

## Ads

![Denkmal](/static/images/posts/media/denkmal/Denkmal-Ad-Absacker.png)
![Denkmal](/static/images/posts/media/denkmal/Denkmal-Ad-Montagsdepressionen.png)
![Denkmal](/static/images/posts/media/denkmal/Denkmal-Ad-Nachtaktiv.png)
![Denkmal](/static/images/posts/media/denkmal/Denkmal-Ad-Schlaflos.png)

## Resources

- Illustrator


Denkmal.org


Second Edition: [Frontâle Festival](https://www.frontale.ch) - French Music Festival 2016

## Webdesign

![Frontale](/static/images/posts/media/frontale-2016/Frontale-App.jpg)

## Print

![Frontale](/static/images/posts/media/frontale-2016/Frontale-Postcard.png)
![Frontale](/static/images/posts/media/frontale-2016/Frontale-Impression-1.jpg)
![Frontale](/static/images/posts/media/frontale-2016/Frontale-Impression-2.jpg)

## Resources

- Illustrator


Frontâle Festival 2


[Frontâle Festival](https://www.frontale.ch) - French Music Festival 2015

## Logo Design

![Frontale](/static/images/posts/media/frontale/Frontale-header.png)
![Frontale](/static/images/posts/media/frontale/Frontale-rooster.png)

## Print

![Frontale](/static/images/posts/media/frontale/Frontale-Print.png)
![Frontale](/static/images/posts/media/frontale/Frontale-Shirts.jpg)

## Resources

- Illustrator


Frontâle Festival


Logo for a the organisation "Schiff Mode".

![Schiff Mode](/static/images/posts/media/schiff-mode/SchiffMode-Logo.png)

![Art44](/static/images/posts/media/art44/Art44-Logo.png)

## Resources

- Illustrator


Logo Designs


Drafts for a game idea.

![Save Me](/static/images/posts/media/save-me/SaveMe1.png)
![Save Me](/static/images/posts/media/save-me/SaveMe2.png)
![Save Me](/static/images/posts/media/save-me/SaveMe3.png)

## Resources

- Photoshop


Save Me


Open source project to connect and support the developer community in Basel. Project hosted on [Github](https://github.com/MadeInBasel/madeinbasel.github.io).

![Made in Basel](/static/images/posts/media/made-in-basel/MadeInBasel-Website.png)
![Made in Basel](/static/images/posts/media/made-in-basel/MadeInBasel-Badges.png)

## Resources

- Illustrator
- html, css


Made in Basel


Ingress illustrations to get beta invitation ;)

![Ingress](/static/images/posts/media/ingress/Ingress1.jpg)
![Ingress](/static/images/posts/media/ingress/Ingress2.jpg)
![Ingress](/static/images/posts/media/ingress/Ingress3.jpg)
![Ingress](/static/images/posts/media/ingress/Ingress4.jpg)

## Resources

- Photoshop


Ingress


An Avatar for every employee at Cargo Media. See in action on [www.cargomedia.ch](https://www.cargomedia.ch).

![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/cow.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/dog.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/elephant.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/fish.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/fox.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/hen.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/hippo.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/monkey.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/owl.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/panda.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/pig.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/seahorse.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/sheep.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/stag.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/whale.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/zebra.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/bat.png)
![Avatars Screenshot](/static/images/posts/media/cargomedia-avatars/catapillar.png)


Cargo Media Avatars


Web Experiments. See more at [Github](https://github.com/stophecom/StopheWebLab).

<video src="/video/char_run_hq.mp4" autoplay loop></video>


Web lab


Random photographs.

![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Island.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Kiss.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Kiss1.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Luck.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Metamorphose.png)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Mirror.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Shadow.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Tree.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-WindowTree.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Sun.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Trash.jpg)
![Lost and Found](/static/images/posts/media/photography-lost-and-found/LostAndFound-Ad.jpg)


Lost and Found


Take a look inside my head ;)

<iframe width="853" height="480" src="https://www.youtube.com/embed/o7t-qajcxzk" frameborder="0" allowfullscreen></iframe>

## Resources

- MRI-Data
- [MeVisLab](https://www.mevislab.de/)
- Adobe AE


Inside my brain


Paris Photographs

![Paris Love](/static/images/posts/media/photography-paris/FPWL-Love.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-LittleBitch.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Metropolitan.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-NY.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Punk.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Shadows.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-TGV.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-WeShallneverSurrender.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Flag.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Cracks.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Beat.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-Flash.jpg)
![Paris Love](/static/images/posts/media/photography-paris/FPWL-404.jpg)


From Paris with Love


Create and develop the Cargo Media Corporate Identity. (Including website implementation.) See full website: [www.cargomedia.ch](https://www.cargomedia.ch).

## Webdesign

![Cargo Media Website](/static/images/posts/media/cargomedia/CargoMedia-App.jpg)
![Cargo Media Website](/static/images/posts/media/cargomedia/CargoMedia-Website.png)

## Logo

![Cargo Media Logo](/static/images/posts/media/cargomedia/CargoMedia-Logo.png)


Cargo Media CI


Some experiments with 3d software.

## Glass & Shatter

![3D Glass Shatter](/static/images/posts/media/3d/3D-GlassShatter.png)
![3D Glass Shatter](/static/images/posts/media/3d/3D-GlassShatter2.png)
![3D Glass Shatter](/static/images/posts/media/3d/3D-GlassShatter3.png)
![3D Glass Shatter](/static/images/posts/media/3d/3D-GlassShatter4.png)
![3D Glass Shatter](/static/images/posts/media/3d/3D-GlassShatter5.png)

<iframe width="853" height="480" src="https://www.youtube.com/embed/e0Qqgq8yOPI" frameborder="0" allowfullscreen></iframe>
<iframe width="853" height="480" src="https://www.youtube.com/embed/kEYlA4NuxTs" frameborder="0" allowfullscreen></iframe>

## Character

![3D Character](/static/images/posts/media/3d/3D-Character.png)
![3D Head](/static/images/posts/media/3d/3D-Head.png)
![3D Head](/static/images/posts/media/3d/3D-Head2.png)
![3D Head](/static/images/posts/media/3d/3D-Head3.png)
![3D Head](/static/images/posts/media/3d/3D-Head4.png)
![3D Head](/static/images/posts/media/3d/3D-Heads.png)
![3D Monster](/static/images/posts/media/3d/3D-Monster.png)
![3D Monster](/static/images/posts/media/3d/3D-Monster2.png)
![3D Monster](/static/images/posts/media/3d/3D-Monster3.png)

<iframe width="853" height="480" src="https://www.youtube.com/embed/wnD3ESpbgqE" frameborder="0" allowfullscreen></iframe>

## UV Mapping

<iframe width="853" height="480" src="https://www.youtube.com/embed/ohipkLW27tk" frameborder="0" allowfullscreen></iframe>
<iframe width="853" height="480" src="https://www.youtube.com/embed/svrmvCLmJhQ" frameborder="0" allowfullscreen></iframe>

## Tree Tutorial

![3D Tree](/static/images/posts/media/3d/3D-Tree.png)
![3D Tree](/static/images/posts/media/3d/3D-Tree2.png)
![3D Tree](/static/images/posts/media/3d/3D-Tree3.png)

## Resources

- Maya
- Zbrush
- Adobe Premiere


3D Experiments


Logo for Gundeli Street Team - Basel running community.

![Gundeli Street Team](/static/images/posts/media/gundeli-street-team/GST-Man.png)
![Gundeli Street Team](/static/images/posts/media/gundeli-street-team/GST-Woman.png)

## Resources

- Illustrator


Gundeli Street Team


## Bachelor Thesis, LGK, HGK, FHNW 2011

Why video games matter – The following paper discusses the significance of videogames. What is a videogame and what could it be in the future. I more or less discuss these topics:

- A short excursion on game theory and why it can’t be an appropriate description for modern games.

- What differs the medium videogame from other media.

- A comparison between play and work.

- Games and Art

[Aus Spiel wird Ernst (german)](/static/images/posts/media/ba/BA_Christophe_Schwyzer_2011_Aus_Spiel_wird_Ernst.pdf)

## Practical Part

I created this game prototype as part of my Bachelor Thesis at the LGK, HGK, FHNW. It is based on the Platformer Starterkit. Although it’s not a sophisticated game, I learned a lot about what the basic components of a game are and what is needed to (literally) animate them. The game contains 4 levels.

In brief (german)

Voxel – Artventure Game: Spielprototyp für die XBox 360.

Das Spiel Voxel ist ein sogenannter Sidescroller. Es gilt den Spieler von A nach B zu bewegen und dabei Hindernisse zu überwinden. Der Spieler hat in diesem Prototyp die Möglichkeit zu gehen und zu springen. Zusätzlich kann er zwei verschiedene Arten Sterne einsammeln. Die Gelben erhöhen lediglich den Punktestand, während die Roten Spezialkräfte freisetzen, anhand deren die Gegner ausgeschaltet werden können. Die Spieleranimationen entstanden hauptsächlich in Autodesk Maya und Adobe Photoshop, während für das Leveldesign zusätzlich noch Adobe Illustrator zum Einsatz kam. Programmiert ist das Spiel in C#, realisiert in der Entwicklungsumgebung Visual Studio in Verbindung mit dem XNA Game Studio von Microsoft.

A short summery in pictures about the working process:

[Work in Progress](/static/images/posts/media/ba/BA-VoxelPrototype-WorkInProgress.pdf)

### Preview

<iframe width="640" height="480" src="https://www.youtube.com/embed/iRZAUOhooF0" frameborder="0" allowfullscreen></iframe>

### Resources

- Maya
- Maya Voxelizer Plugin
- Photoshop
- Illustrator
- Visual Studio
- XBox XNA Game Studio (App Hub)
- FL Studio
- XBox 360


Games


Futuristic model for the headquarters of the Academy of Art and Design Basel.

<iframe width="853" height="480" src="https://www.youtube.com/embed/A3warSBSEPg" frameborder="0" allowfullscreen></iframe>

## Resources

- animated with google sketch up 8
- edited with adobe premiere cs4
- effects with adobe after effects cs4
- sound by david holmes – yen on a carousel & stealing the stock


Dreispitz 21


A friendly reminder that you can do whatever you like.

![The World is Yours](/static/images/posts/media/world-is-yours/TheWorldIsYours.jpg)
![The World is Yours](/static/images/posts/media/world-is-yours/TheWorldIsYours2.jpg)

## Resources

- Photoshop


The World is Yours


Cut out from a cuboid of gypsum.

![Sculpture](/static/images/posts/media/sculpture/Sculpture1.jpg)
![Sculpture](/static/images/posts/media/sculpture/Sculpture2.jpg)


Sculpture


![Portrait](/static/images/posts/media/portrait/Portrait1.jpg)
![Portrait](/static/images/posts/media/portrait/Portrait2.jpg)
![Portrait](/static/images/posts/media/portrait/Portrait3.jpg)
![Portrait](/static/images/posts/media/portrait/Portrait4.jpg)
![Portrait](/static/images/posts/media/portrait/Portrait5.jpg)


Portraits


Handmade stuff.

![Old Man](/static/images/posts/media/painting/OldMan1.jpg)
![Old Man](/static/images/posts/media/painting/OldMan2.jpg)
![Old Man](/static/images/posts/media/painting/OldMan3.jpg)


Old Man


Some old comic drafts.

![Noir](/static/images/posts/media/noir/Noir1.jpg)
![Noir](/static/images/posts/media/noir/Noir2.jpg)
![Noir](/static/images/posts/media/noir/Noir3.jpg)
![Noir](/static/images/posts/media/noir/Noir4.png)
![Noir](/static/images/posts/media/noir/Noir5.png)

## Resources

- Photoshop


Noir


This Lamp is mainly made out of paper. The half transparent paper gives a nice light, combined with the irregular squares, a real nice effect with almost no costs. Downside of course is that you can barely touch it and its broken ;)

![LED Lamp](/static/images/posts/media/led/LEDPaperLamp.png)

## Resources

- 25 white LEDs
- AC to DC 12 V Adapter
- some resistors, cables
- paper 90 g/m2


LED Paper Lamp


"Fashion brand idea"

![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-Logo.png)

## Shirts

![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtGeneral.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtMajor.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtMonk.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtSpy.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtViolence.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtGoldeneye.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtConverse.jpg)
![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-ShirtLanguage.jpg)

![Kingchiller](/static/images/posts/media/kingchiller/Kingchiller-Army.png)


Kingchiller


Sketches.

![Black n White](/static/images/posts/media/bw/BW1.jpg)
![Black n White](/static/images/posts/media/bw/BW2.jpg)
![Black n White](/static/images/posts/media/bw/BW4.jpg)
![Black n White](/static/images/posts/media/bw/BW5.jpg)


Black n' White


Sketches.

![Drawing](/static/images/posts/media/drawing/Drawing1.jpg)
![Drawing](/static/images/posts/media/drawing/Drawing2.jpg)
![Drawing](/static/images/posts/media/drawing/Drawing3.jpg)
![Drawing](/static/images/posts/media/drawing/Drawing4.jpg)
![Drawing](/static/images/posts/media/drawing/Drawing5.jpg)


Drawing


Some old web design drafts that are either outdated or were never implemented.

![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-BBB.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-BBB2.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-ApartmentSever.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-JessicaBuschor.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-Lernwerk.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-SpitzenOpenair.jpg)
![Webdesign Depreciated](/static/images/posts/media/webdesign/Webdesign-Voxel.jpg)

## Resources

- Illustrator
- Photoshop
- Flash
- html, css
