JuristischeStudiengesellschaftKarlsruhe

Our Design Language

...and how it represents our work-ethic.

Sophisticated. Minimalist. Perfection.

By Jonathan Arbely

September 2nd, 2019

The Design Language developed for our “Magellan Code & Design Consulting” Brand & Portfolio Website represents our sophisticated, minimalist and ambitious approach. Whether that's Coding, Designing or Consulting, our Brand & Portfolio represent us, and convey to our Clients a powerful first impression: “Make Overachieving a habit”

Every color, font and element used has been carefully designed, critically challenged and re-designed to represent us both on- & offline. Drawing inspiration from Gothic & Renaissance architecture, this is an ongoing project and a way for us to continuously learn and improve.

We are serious about good design!

To build collaborative, future-proof atomic designs, we use Adobe Xd (free & cross-platform) and make use of all its cloud features such as the creative cloud online-collaboration tool, the “Assets” design-documentation-system and the dynamic prototyping capabilities.

...and obsess over clean & cutting-edge coding techniques.

To hone our coding skills, test our workflow and stay up-to-date on the latest developments in the design- and frontend-communities, we like to constantly and actively test and implement different solutions & techniques focusing around performance, workflow, collaborative coding and “atomizing” (making code reusable). Often right here on our own website.

All in all, we think our past work achieves to showcase our dedication and work-ethic very well. We may present:





/ Excerpt from our Company Flyer



/ Behind the scenes: Note the "Assets" panel on the left, where Colors, Fonts and Components are documented and made reusable

Good work pays of. And for us that means sophisticated design-work and clean code built around our customers needs and wishes. An iterative approach and close communication keeps everyone up-to-date on the latest Work-In-Progress and provides our customers with a sense of ownership throughout the development & design processes.

Feel inspired? Reach out to us anytime!

Boost your confidence? Read through our Testimonials to see what others think about our work.


Great examples and highlights of our work can be found either over on our Instagram or Dribbble.

One great example is the design-system we built for Interhome (Vacation-homes and apartments rental-service worldwide based in Glattbrugg, Switzerland) that is used by millions every year and has meanwhile been utilized to relaunch the Inter Chalet (Based in Freiburg im Breisgau, Germany) website.


View this post on Instagram

Creating and maintaining sophisticated and well documented Styleguides is a must for every big design project. Especially when multiple designers are designing new sites and modules. This Styleguide was created in Adobe XD and Sketch implementing dynamic and reusable elements following atomic-design principles. #styleguide #atomicdesign #webentwickler #agentur #webdesign #webdev #code #design #ui #ux #freelancer #mockup #screendesign #uidesign #adobexd #sketch #xd #sass #startup #gulp #webdeveloper #whiteminimal #minimaldesign #minimalism #perfectdesign #dailyinspiration #designinspiration #uiinspiration #dribbble

A post shared by Magellan Code & Design Cons. (@bymagellan) on

Back to 'All Projects'