kay wild

Yourmeal

Emmi

EMMI

Development and maintenance of a multi-brand, multi-country, and multilingual CMS solution that brings together the diverse digital presence of the Emmi Group within a unified platform. The solution enables efficient content management while maintaining a consistent digital experience and accommodating the individual requirements of each website.

Merkle Case Study

Websites of the Emmi Group include:
- Emmi Group
- Emmi Caffè Latte
- ...

Contributing to the project since 2024.

Yourmeal
Emmi Caffe Latte
Beleaf
Yourmeal product shot
Back to overview
scout

Scout

SCOUT

Established the frontend foundation for Scout using Next.js, setting up the structure for a scalable and maintainable application.
Scout is an AI-powered agent that searches the entire workforce based on skills, experience, real-time availability, and other relevant attributes.
It helps identify the right experts for specific projects and generates client-ready CVs within minutes, streamlining resource allocation and staffing processes.

scout
Back to overview

Financial Institution

Charts

Forms

HBS

Magnolia

SCSS

Tables

TS

UI

client

–

nda

FINANCIAL INSTITUTION

Development of visually appealing and interactive UI components for a project covered by a non-disclosure agreement (NDA).
Due to confidentiality requirements, further project details cannot be disclosed.

nda
Back to overview

DA Direkt

Next.js

Performance

React

SCSS

SEO

Sitecore

client

–

DA Direct insurance tablet

DA DIREKT

Completion of a broad range of tasks, from component development to detailed SEO, performance, and accessibility improvements for da-direkt.de.
Case study: www.merkle.com

DA Direct insurance tablet
DA Direct insurance style guide
DA-Direct insurance mockups
Back to overview

Basellandschaftliche Pensionskasse

CSS

FTL

Magnolia

TS

Vue.js

client

–

BLPK Stage - Pensionskasse mit Weitblick

BASELLAND­SCHAFTLICHE PENSIONS­KASSE

Development of various UI components for blpk.ch, the website of the Basellandschaftliche Pensionskasse, a Swiss public pension fund.
The work includes key interface elements such as the header, footer, tables, graphs, and other reusable UI components, contributing to a consistent, accessible, and user-friendly digital experience.

BLPK Stage - Pensionskasse mit Weitblick
BLPK Stories
BLPK Anlageübersicht
Back to overview

Documentation

Documentation

Markdown

Nextra

private

docs

DOCUMENTATION

Built a space for documentation and notes.
Available here: docs.kaywild.ch

docs
Back to overview

Web Builder Exploration

Figma

GSAP

Webflow

Wix Studio

private

Los Angeles Lakers website

WEB BUILDER EXPLORATION

An exploration of Webflow and Wix Studio through two experimental projects.

Webflow — Los Angeles Lakers Demo
A Webflow playground exploring interactions and animation with GSAP: lalakers.webflow.io

Wix Studio — Ristorante Sonnenberg
A simple, clean landing page for an Italian restaurant.

Los Angeles Lakers website
Kobe Bryant and LeBron James
website with images of pasta and wine
website with map and opening hours
Back to overview

Flow

Next.js

React

Shadcn

Tailwind

private

flow

FLOW

A budgeting app designed to help track expenses, manage finances, and understand where your money goes.
Flow was developed as a side project to apply and deepen knowledge of React and Next.js by building a practical, real-world application.
The focus was on creating a clean, fast, and intuitive user experience while exploring modern frontend development techniques.
Explore the app: flow-budget.vercel.app

flow
Back to overview

Stay AI

AI

API

CSS

Gemini

HTML

JS

JSON

Netlify

private

list of cities that perfectly fit the criteria

STAY AI

Whether you're looking for a change of scenery, a new adventure, or a place to call home... Stay is for you.
It is an AI-powered destination website, designed to help users find places that match their preferences
Built using HTML, CSS, and JavaScript, the app integrates Google Gemini AI through its API to generate personalized suggestions.
A Netlify serverless function handles API requests securely, keeping API credentials out of the client-side code.
Explore the website: stay-ai.netlify.app

list of cities that perfectly fit the criteria
details about San Diego
Back to overview

Portfolio

HBS

JS

SCSS

private

Google Lighthouse 100 score

PORTFOLIO

Complete rebuild of my portfolio from scratch, with a focus on improving UI/UX, performance, accessibility, and SEO.

Google Lighthouse 100 score
Figma moodboard and wireframes
Back to overview

Machine Learning

Google Colab

Kaggle

ML

NN

private

datasplitting explanation

MACHINE LEARNING

Exploration of machine learning fundamentals driven by personal curiosity.
The project focuses on learning the basics, documenting key concepts, and collecting useful resources for future reference.
Documentation and further links: docs.kaywild.ch

datasplitting explanation
probability graphs
ML definitions
Back to overview

FC St. Gallen Newsletter

Dynamics 365

CSS

HTML

client

–

FC St. Gallen newsletter match preview

FC ST. GALLEN NEWSLETTER

Creation of three newsletter templates using HTML and CSS for the Swiss football club, integrated into Microsoft Dynamics 365. The templates are used for weekly email communications tailored to different target audiences, including fans, business partners, and other stakeholders. Each template is designed to ensure consistent branding and reliable rendering across different devices and email clients.

FC St. Gallen newsletter match preview
FC St. Gallen newsletter ligaphase
FC St. Gallen newsletter gameday
Back to overview

FC St. Gallen Ticket Shop

CSS

HTML

JS

client

–

FC St. Gallen ticket shop

FC ST. GALLEN TICKET SHOP

Enhancement of the FC St. Gallen ticket shop using HTML, CSS, and JavaScript to improve the ticket purchasing experience. The work focused on refining the user interface and aligning the shop's design with the club's main website to ensure a consistent visual identity.

FC St. Gallen ticket shop
Back to overview

Beyond Gravity

Drupal

SCSS

TS

Twig

client

Beyondgravity tunnel

BEYOND GRAVITY

The first client project involved implementing new features and contributing to code quality for RUAG's beyondgravity.com website.
Technologies used where SCSS, TypeScript, and Twig.

Beyondgravity homepage
Beyondgravity mobile screens
Beyondgravity navigation
Beyondgravity satellites
Back to overview

Investment Calculator

Angular

Auth

Firestore

CSS

HTML

TS

private

interest calculator home

INVESTMENT CALULATOR

An interactive compound interest calculator that visualizes investment growth over time through dynamic charts and projections.
Users can sign in to save their calculations and customize additional parameters for different investment scenarios.
Developed as a private project using Angular, TypeScript, HTML, and CSS, with Firebase Authentication for user sign-in and Cloud Firestore for data storage.
Try it out: investment-calculator-a5a6a.web.app

interest calculator home
interest calculator explanation
interest calculator graph
Back to overview

Info-Screens

API

CI/CD

Docs

HBS

JS

SCSS

thesis

weather screen

INFO-SCREENS

Part of the ten day final thesis of becoming an application developer (VET) in 2023, was the implementation and documentation of this unique, animated web application.
It is displayed on a TV screen in the office and shows a fluid sequence of time- and day-dependent information.
Those following four types of screens where implemented.

- Welcome: Greets with a message suitable for the time and day
- Input: Reminds of hydration and provides other food for thought
- Weather: Shows the live weather of the current and two other locations
- Joke: Cheers up

weather screen
mockup screen mockup
joke screen
application shown in office
Good afternoon screen
Back to overview

Portfolio (old)

HTML

JS

SCSS

private

portfolio 2023 stage

PORTFOLIO (OLD)

Design and deployment of my first portfolio website to showcase projects, highlight technical skills, and document my development journey.

portfolio 2023 stage
portfolio 2023 project
Back to overview

Education. Merkle.

Animations

Theming

Cookies

CI/CD

GA

internal

Education. Merkle. homepage

EDUCATION. MERKLE.

Addition of new features to the company's educational website.
Including a cookie banner, light-theme, GitLab CI/CD pipeline, and tracking using Google Analytics.

Education lightmode
Education mobile
Education project view
Back to overview

Nestbox Manager

ASP.NET

C#

HTML

MVC

Razor

private

nestbox

NESTBOX MANAGER

Nestbox Manager is an ASP.NET MVC web application designed to simplify the management and monitoring of nestboxes.
Users can record nestbox locations, track individual boxes, and document maintenance activities.
The project involved setting up the application and developing core features using C#, ASP.NET MVC, Razor, and HTML.

nestbox
Back to overview

Connect

Angular

App

Figma

Ionic

iOS

private

Connect app on mobile device

CONNECT

Concept, design and proof of concept of an employee management app.
It focused on efficiently managing large employee rosters, facilitating professional networking, and enabling targeted knowledge sharing and exchange of expertise.
The UI/UX design was created in Figma, and an interactive prototype was developed using the Angular and Ionic frameworks.

Connect app on mobile device
Connect screens
Back to overview

Baseball Statistics

Auth

Charts

Data Visualisation

Java

Spring

SQL

private

baseball statistics

BASEBALL STATISTICS

A Java Spring Boot website for exploring Major League Baseball stats.
Dive into detailed player and team profiles, view game results, and explore interactive charts.
Easily compare teams to gain deeper insights into the game.

baseball statistics
Back to overview

Apparel Display

Auth

CRUD

CSS

HTML

PHP

SQL

private

Apparel

APPAREL DISPLAY

In the PHP department, the technology was learned and then applied to build the Apparel Display.
The web application manages sneaker entries with autentication and CRUD functionality.
An SQL database stores the data.
The frontend was built using HTML and CSS and has scroll animations.

Apparel
Back to overview

Education. Namics.

HBS

SCSS

TS

UI

internal

Education homepage

EDUCATION. NAMICS.

Conceptualization, design, and implementation of an application from A to Z – in close collaboration with an interactive media designer.
The end product is a website where students can gain insight into the company's vocational training.

Education homepage
Back to overview

Frontend Fundamentals

CSS

HTML

JS

private

blackjack table

FRONTEND FUNDAMENTALS

Around half of the four-year apprenticeship training focused on frontend development.
The fundamentals where learned by solving practical tasks and projects using HTML, CSS, and JavaScript.
Some interactive applications, built during that time, include:
- Modern and minimalistic calculator, that uses the keyboard for input
- 20x20 2D snake game
- Blackjack with mathematically correct shuffling and dealing

calculator
snake game
snake game over screen
blackjack table
Back to overview

About

Dedicated Frontend Engineer based in Switzerland. Skilled in crafting seamless user experiences and continuously learning. Working at Merkle while pursuing a Professional Bachelor's (HF) degree in Information Technology.

Work Experience

Frontend Engineer

Merkle DACH

–

Junior Application Developer

Merkle DACH

–

Junior Application Developer

Namics

–

Education

Diplomas
Information Technology [ongoing]Professional Bachelor (HF)
Computer Science, Application DevelopmentFederal Diploma of Vocational Education and Training (EFZ)
Certificates
A11y for Web DevelopersSiteimprove
Merkle Developer Digital A11ySiteimprove
Frontend DevelopmentLinkedIn
Layout and CompositionLinkedIn
AI – Neural NetworksLinkedIn
TypeScriptLinkedIn
ReactCodecademy
React ProficiencyPercipio
Intermediate Machine LearningKaggle
Drupal 9 DevelopmentAcquia

Techstack

HTML/HBS

CSS/SCSS

JS/TS

UI/UX

Git

React

Node

Angular

Vue

Java

PHP

C#

Topics

chart