Client
bachelor thesis
Year
11.2023 – 01.2024
What I did
stakeholder analysis, competitor analysis, personas, user story mapping, information architecture, wireframes, scribbles, atomic design system, mockups, feedback loops, prototyping
Jump to websiteKILL CONTROL is the name of my own comic series, on which I passionately work in my free time and privately sell. As part of my bachelor's thesis, I completed the second volume, created a fitting trailer, and designed a companion website for the comic series. The combined result of all three projects offers the multimedia KILL CONTROL EXPERIENCE, aiming not only to promote my passion project but also to showcase the knowledge I have acquired from my studies and professional experience. In this context, I will specifically describe the process of the website design.
In the past, I had to print a large quantity of copies in advance and sell them independently for the release of Volume 1. This was a cumbersome process back then and would take up too much time today. Additionally, I don't have a consistent description or excerpts readily available to persuade interested individuals when privately discussing my comic. Furthermore, there is a long waiting period between the first and second parts, causing many readers to forget crucial story details.
A companion website for my comic series aims to inform readers with summaries and entice potential buyers through engaging content, eliminating the need for my direct involvement. Purchases will be facilitated through an external shop.
To gain an overview of the project situation, I identified all involved individuals through a stakeholder analysis and compared websites with similar concepts in a competitive analysis.
To better understand the target audience and their requirements, I created three personas. These are based on my experiences as a comic seller and incorporate influence factors tailored to my own preferences.
Based on the insights gathered from the personas and my own requirements, I created an overview of all necessary functions and content, grouping them into logically connected pages. Subsequently, I determined the hierarchy and connections of the pages in an information architecture.
Once satisfied with the information architecture, I initiated the design process, creating wireframes for both the mobile and desktop views.
To get a rough idea of the design and functionality, I sketched page elements, structures, icons, and potential illustrations. I also gathered inspirations in the form of a moodboard.
To streamline the design process, I implemented a design system following the principles of Atomic Design. In this approach, components are divided into atoms, consisting of individual elements such as fonts or icons. Multiple atoms form molecules, such as buttons or cards. A combination of molecules creates organisms, for example, headers or general sections. Ultimately, these organisms collectively form the individual pages.
My design goal is to create a bold and graphic website in a comic style, showcasing my art style and staying true to the existing branding of KILL CONTROL. I've presented my design progress to other designers multiple times, tested the functionality, gathered feedback, and improved it accordingly. As a result, I have documented a total of 7 feedback iterations.
I followed the Mobile-First approach and created a mobile prototype. All pages are interconnected, featuring animations, sticky elements, and functional accordions.
My finished work not only fulfills the purpose of my bachelor's thesis but also enriches my personal life. It incorporates knowledge from all facets of my current life, from studies and work to private hobbies. This is the complete KILL CONTROL EXPERIENCE!
The page will subsequently be coded independently by me using HTML, CSS, and Javascript.
