Sandra Löfgren

A classmate and I developed a CMS for a beverage store using Laravel. The project was not deployed, but, as seen in the screenshot, the frontend part was pretty minimalistic and designed with accessibility as its main focus. The main thing, though, was the code in itself – so feel free to have a look at the source on github!

This project was in collaboration with a fellow classmate and two digital design students. On my part, it was very backend heavy, which was interesting for me who usually prefer frontend. I got to learn how to set up a project with Next.js, create components with React and make use of a Postgres database with Supabase.

Since I've mostly made generic WP themes in the past, in order for others to download and use, I took the opportunity to experiment with subpages and custom template files in this project. When making this site about Rammstein, I explored solutions for different kinds of content, usch as individual about pages, albums, lyrics, shop items etc.

As an individual project in C#, I made a simple slide puzzle game to be played directly in the console. That did not stop me from having some fun, though, with ascii and colors. Download it on github to give it a try!

Using Node.js and Express, two classmates and I developed a web scraper utilizing Cheerio and Puppeteer. While we didn't deploy the scraper, I made a static page that showcases the front-end, which was primarily designed and developed by me.

As an individual project, where the task was to create a fictive hotel website using the web development concepts learned so far, I chose to build a vampire hotel. I put a lot of thought into the design and the content of the site. I named the hotel after Ada Lovelace, the first computer programmer.

A simplified pokédex, made using the PokéAPI. This was my very first try at fetching content from an API and present it in a stylish way with a responsive design.

In collaboration with two digital design and three computer graphics design students, a fellow web developer student and I had two weeks to translate the design from Figma into HTML and CSS. Displaying the products in a DRY way, PHP arrays and loops were used. We also implemented a carousel with buttons, a color picker and a toggle between product images with JavaScript.

This project was a collaboration with two fellow web developer students. Our main task was to make a design in Figma for a fictional cinema and then translate the main elements into code. Semantic HTML and CSS-grids were used for the structure. A bit of JavaScript was included for things like sticky menus and PHP was used to loop in movie posters. I coded most of it.

Using Figma, I created a logotype for myself. I decided to make it a bunny, since I love them and have had bunnies for most of my life. Furthermore, I'm often drawn to polar opposites – such as minimal but colorful, retro but sci-fi, flowy yet structured – and I tried to make this logo reflect a balance.

One Friday in school we learnt about event listeners in JS, and I immediately knew I had to make a retro pixelart game where the character could move on key press commands. I cancelled my plans for that weekend and this is how it turned out! (NB: View on a device that has a keyboard.)

As a psychologist, I've told many patients to do breathing exercises. In this project, I visualized two of them with CSS-animations!

This game of Rock-Paper-Scissors was coded with very basic PHP, as I was just starting to learn the language. To make it extra fun, I tweaked it into Sheldon Cooper's version "Rock-Paper-Scissors-Lizard-Spock". The page was structured with HTML and basically no CSS, staying true to the back-end feel of the game.

A freelance project where I created a site for a business featuring online courses on dog wellbeing. The client wanted to host the site on Wix.com, which unfortunately meant I couldn't alter the HTML or CSS, but I did the best I could with the design despite that and also designed the logo.

An old design from 2009 for my then portfolio site and blog at designdonkey.com. I still find it quite nice actually, especially given that I had no flexbox or css-grids to rely on – css-reset, floats and clearfix for the win!