University Search Web Application

Working in a small team, I was primarily responsible for frontend architecture and API integration. The application consumes and processes external API data to enable dynamic filtering and exploration of study programs.

The user interface was first prototyped in Figma and then implemented using Vue.js with a modular, component-based architecture. Parent–child communication and application state were structured to maintain a scalable and maintainable frontend architecture.

Filtering and search functionality are handled through client-side data processing based on the retrieved API data, enabling fast interaction without repeated server requests.

The application also integrates user authentication and server-side storage to persist user-specific preferences such as saved universities.

A responsive, mobile-first design approach was used to ensure usability across desktop, tablet, and mobile devices.

Full-Stack Web Application with Hybrid Rendering

This project explored full-stack web application architecture using Astro as the core framework, combining server-side rendering with client-side interactivity through Solid.js.

The user interface was built with TailwindCSS following a mobile-first and fully responsive design approach inspired by the Spotify interface. The primary focus was not on visual uniqueness but on developing a reusable, component-based design system.

Designed a relational database schema in SQLite, defining structured entity relationships with primary and foreign keys. Contributed to the data modeling and frontend integration, while database setup was handled by a team member.

Architected dynamic page templates that retrieve and render backend-stored content via UUID-based routing. This enabled scalable content management while maintaining efficient rendering performance.

Procedural Animation and Behaviour Simulation

This project focuses on combining mathematical modelling, procedural generation, and behavioural algorithms to create a small interactive ecosystem of salamanders. Each salamander is created using a chain of connected body segments defined through distance constraints and linear algebra.

The system is implemented using an object-oriented architecture with JavaScript classes to manage entity behaviour, animation logic, and environmental interaction.

The body shape emerges from varying segment radii, allowing the creatures to be procedurally generated rather than manually designed.

Movement is simulated through simple flocking behaviours, enabling the salamanders to navigate their environment while searching for berries and avoiding obstacles such as leaves and other creatures. This creates an emergent sense of life similar to fish moving within a pond.

Leg movement is generated using an inverse kinematics approach based on the FABRIK algorithm, allowing the limbs to dynamically adjust to the body motion.

Interactive Web Experience with Dynamic Animations

Dreaming Plants is an interactive web experience designed as a relaxing second-screen environment for studying or unwinding. The application presents a hand-drawn apartment scene where animated elements create a calm, living atmosphere and allow for small user interactions.

The environment combines passive ambient animations with interactive elements. Objects within the room react to user input, such as a computer that launches a built-in Pomodoro timer for focused study sessions. Randomized animation delays and event-driven interactions help simulate a natural, dynamic environment.

This project explores how web technologies can be used to create interactive, game-like browser experiences that blend animation, environmental simulation, and user interaction

A key feature of the project is a dynamic lighting system based on the user's real-world time of day. Using the SunCalc library together with browser geolocation, the application calculates solar positions and adjusts the scene lighting accordingly. Five different lighting states simulate the transition from midnight to midday, including sunrise and sunset phases, creating an immersive ambient effect.

All animations were created in Adobe Animate and exported as HTML5 canvas objects. JavaScript and CreateJS were used to control animation timing, trigger mouse events, and manage dynamic scene behaviour.

Mobile Application for Artists to Manage and Archive Artworks

This project explored Flutter’s widget-based architecture through the development of a mobile application that allows artists to securely document and manage their artworks. The user interface was designed using Google's Material Design component system and implemented with Flutter’s widget structure.

The application focuses on a clean, component-driven UI architecture and responsive interaction patterns typical for modern mobile applications.

The application implements full CRUD functionality for artwork records using Firebase, enabling a simple but functional archive system.

The main technical challenge of the project was understanding Flutter’s widget hierarchy and establishing efficient communication between parent and child widgets while maintaining a modular UI structure.

Developed in a two-person team. I was primarily responsible for UI architecture, widget implementation, and backend integration, while also contributing to the data structure design. The Firebase backend setup was implemented by my teammate.

NGO Website Design and Development

This project involved the redesign and development of the website for the youth center anyway e.V. following a new branding initiative. The goal was to translate the updated visual identity into a modern, accessible website while restructuring a large amount of existing content.

Extensive user and stakeholder analysis helped identify the needs of young participants, sponsors, and government officials.

Research into NGO web design and sponsorship acquisition strategies helped define the information architecture and structure of the new homepage.

An atomic design system helped create a fluid and consistent design that could be seamlessly translated into code.

The homepage

The youth center's activities each have their own dedicated pages, featuring a responsive color-coding system that highlights different events, activities, and key participant groups.

AnySpaces can be accessed through both the navigation bar and the homepage.

A calendar was implemented to provide a quick and clear overview of all activities offered by anyway e.V.

Additional interface elements such as countdowns were introduced to highlight upcoming events and help users plan participation.

The website was implemented using WordPress with the Bricks builder to allow the organization to manage and update content independently within a familiar CMS environment.

Ocean Guard - Cross Media Campaign with focus on illustration, user experience research and prototyping

Ocean Guard is a fictional campaign meant to motivate people to consume less fish. The focus was on researching how people can be motivated to reduce their consumption, and then apply this knowledge to create a multimedia campaign.

Using 8 different Methods we created a deep analyiss of the current state of the problem and possible solutions which helpt us to formulate project leading problem and vision statements

User research helpt us define out core audience, and therefore create a targeted approch which would make the campain attracive and doable for the target audience.

An Interview with an Expert at follow food (former follow fish), and a Target audience survery helped us identify why people eat or dont eat fish and how different approaches to increase conscious consumption choices are recived.

We created four different characters, based on swarz theory of universal human values, to group our target audience into micro target groups. We designed an online quizz which helped Users to find their Ocean Guard Hero based on their circumstance and life values.

24 Unique challenges helped offer each User opportunities to bring change into their consumption habbits.

We created a protoype for an ocean guard app which would allowe users to take the quizz, get in contact with other ocean guards, start and finish challenges and read up on targeted information.

By creating a flexible design system based on an atomic design approach we were able to create a unique brand identiy, representable on every medium.