Portfolio

See some

basic web

basic UX/UI

basic animation

basic content

Module 1

Introduction

During the first semester of Multimedia Design at Copenhagen School of Design and Technology have I been introduced to the basics behind front-end development and content creation. The main focus has been on developing the fundamentals of HTML, CSS and very basic vanilla JavaScript. Apart from that, have we also been taught various design conventions and ways to develop your own creations, such as working with crazy 8's, trunk test and a variety of different design sprint methods.

This website is a part of my final examination in the first semester, but it's also a way to showcase my growth and skill-development throughout these couple of months.

Module 2

Basic web

We were introducted during this module to the absolute basics of website-development. We got familiar with terminologies and how to set up the essential softwares on the computer, such as VScode and FileZilla to be able to upload files onto our servers.

The main assignment of this module was to develop a basic, responsive website. Most of the text, images and layout-plans were already handed down to us from our teachers. Our job was to figure out how to create a functional website, includnig all of the assigned content, in the way that the layout plan had called for.

The main take-aways from this module:

Troubleshooting
Searching for information online
Embracing problem-solving

Link to website

Module 3

Basic UX/UI

This was a really fun assignment, where we were introduced to various design conventions, how to brainstorm a design-idea such as using Crazy 8's, analyse user-stories, to how to put together a functional prototype in Figma. In the end we had to create and code the website based of the prototype. It truly felt like a great fun exercise where you got to work with a project from start to finish.

This module provided the foundational principles of how I have approached the following projects.

Link to website

Link to the presentation

Link to the process documentation

The main take-aways from this module:

Putting time and effort in the design-process will improve the final product.
User-inputs are a valuable way to get out of your design-bubble and into the real world.
Having a finalised prototype of the website will save you a lot of time when coding.

Module 4

Basic animation

JavaScript was introduced to us, and the main project of this module was to develop a simple game in a website, learning how to communicate between HTML, CSS and JS. It was incredibly challenging at first, because it was the first time I delved into learning a programming language.

In doing this project, we had to illustrate assets based on a specific style. I chose to analyse the style used in the game Two dots, illustrated by the British illustrator Owen Davey. The illustrations were created using Illustrator, and later exported as SVG.

The sound-effects were also made by me, using Audition to distort the sounds, and the game-music was made by putting loops together in garageBand, making sure the scales were watching what was showing on the screen, think of game-over vs. level-complete.

We were also introduced to CSS animations and positions, and if you are reading this on my website now I guess you can tell I have incoperated quite a bit of animations and interactions in my design.

Link to the game

The main take-aways from this module:

Developing the right way to think when writing JavaScript
Pushing through what felt like impossible tasks
Daring to experiment

Module 5

Basic content

The last module before the exam was divided into two major parts. The first part introduced us to video-recording as a team and doing solo-editing in Premiere Pro. The second and much bigger part involed us as a team of five to take contact with a small business who had an out-dated/non-functional website. With this buisness would we work together in creating a new prototype, record and create a brand-related video, and coding the website.

In the first part of this module did I get to record this passion-related interview with a knitter. It was a great practise to get an idea of how to talk to someone and ask questions, hoping to get them to answer in a story-telling way, which is needed for an entertaining video. I also got to create a website, centering around her. I tried to keep to the same colour-palette and aesthetic as she carried with her.

In the last and biggest project of this semester we worked together with a company namned Tak for Kaffe, where we were going to redesign their website and create a video for them using professional equipment and softwares. For the recording we used my Sony Mirrorless DSLR, and Røde microphone borrowed from Tech Lab at the school.

The redesign of the website was made by using a collaborate Figma-file that I hosted. We started with pointing out what felt typical for this company, then branched out to creating moodboards and potential stylesheets. Later one we got some feedback from the owner of the shop and we created prototype for the redesign of the website.

My initial role in this group assignment however was to be the GitHub master and making sure that the coding got done. I assisted my groupmates whenever needed, but I wasn't allowed to make any changes in their pages. What I was responsible in coding was the index-page, and creating a global navigation and footer, so that it would look the same across the website.

I did also edit the photos and short video on the home-page, using Photoshop for the images, and Premiere Pro for the banner-video.

Link to the interview website

Link to the business website

The main take-aways from this module:

Understanding the need of structuring ones work before-hand
Getting an idea of how to navigate group work
Finding ones strenght and weaknesses