F.S

Portfolio

Initial Idea

I started designing my portfolio at the end of the summer vacation. I just had a simple direction - I wanted it to be kind of exciting with it being divided in half, right side goes down, left side goes up on scroll. But it didn't happen, I couldn't code it for some reason, it was hard. It was a real struggle to get it to work. For this reason I scrapped it, and started designing a new one with feedback from my teachers and peers.

Learning Outcomes Legend

Learning Outcome 1 - Conceptualize, design, and develop interactive media products

Learning Outcome 2 - Transferable production

Learning Outcome 3 - Creative iterations

Learning Outcome 4 - Professional standards

Learning Outcome 5 - Personal leadership

Learning Outcomes Achieved in this project

Learning Outcome 1 - The design of the portfolio went through multiple iterations from the initial idea to concept, and the final product. I created multiple designs which were validated by my teachers.

Learning Outcome 2 - To achieve this LO I used GitLab as my version control. After feedback I started creating branches for certain functionalities and committing as much as possible with meaningful comments. I saw someone who ussed to commmit with no explanation and it had proved to be quite annoying to navigate that repo. That's why I took extra care when committing and merging branches.

Learning Outcome 3 - The designs of the portfolio constantly improved through feedback. That's why in the first iterations I wasn't sure where to go with the design and how to structure the information, but with time everything improved and I believe it's come to the point where finding infromation and navigation are quite easy. Design wise I personally really like it as well.Though For the next time I want to try something different.

Learning Outcome 4 - Communication, help and using Figma, VS code and Git all play a huge part in this LO. Using design methodologies and concepts helped me achieve the minimalistic feel which I wanted. Iterations were a huge part in the success of this portfolio. And being able to navigate GIT was a huge help as well.

Learning Outcome 5 - While making this portfolio I learned how to implement feedback well into my work. It also helped me understand that feedback and not take it to heart when people told me something is not done well. I also learned to manage my anxiety and distrust in myself with the help of others. The reason is because I thought it wasn't enough, and that I didn't do as much as others did, or was lazy. But in hindsight, I think that's not the case and I realized I should believe in myself more. This is one of the main things I learned while making this portfolio.

Process

I started off with making some wireframes, and I used the same inspiration that I had for my previous Idea. This time I wanted my portfolio to be as clean and as simplistic as possible. You can check out my inital designs, inspiration and my current design in the figma file on the right hand side. In this figma file I also went through multiple iterations using the feedback I got from my teachers - Dirk, Stan, Pennie, sometimes my colleagues too. You can see that the legend for the LOs, the layout, and the design evolved from the initial idea to the latest design, which changed even after I was done with the figma because the design simply didn't work.

The two main inspiration websites were Appoline Robert Studio and Flare Department. I wanted to recreate them in some way. So I used the grid structure from one, and the cleanliness of the other. That works extremely well to show content and projects, and not to really tell a story of how I've done things. Therefore I had to change it a bit.

You can also take a look at my personal FP checkpoints and you'll see that I've improved the design and iterated on it using feedback from my teachers. And even though I would've liked it have much more of a refined look, I think it's good enough for now. FeedPulse

One other point of interest in my portfolio is the use of version control. I paid attention and tried to commit as much as possible. In the beginning, I thought that I did not need branches to divide sections of the website. For that reason I did not use them. In the second portfolio review, Josh specifically pointed that out, and even if I'm right, I need to prove that I can work with Git using branches. That's why I started using them and you'll be able to see that in my git.

You can see at the git picture on the right side of the page all the commits I've made. You can also take a look at my GitLab

One of the things that I am really proud of making in this portfolio is the restructuring of the layout. I had really cool ideas in the beginning, I wanted it to be a showcase of my work, but I didn't really make outstanding products which could be shown in the whole half of the screen. Or I needed to show documents, screenshots, etc. which didn't work with the layout that I had in mind. The change that I made isn't the biggest, but dividing paragraphs and images and putting whitespace in between them made the pages and information transform from unreadable and "what the hell is this", to actually at least being readable and easy to understand which I am happy about. The same goes for the fact that I combined the pictures with said paragraphs so they are there, because they are connected to the explanation, which wasn't the case in the previous layout. This was also pointed out by me colleagues and teachers, which adds to the iteration Learning Outcome.

The lesson I learned while going through with this idea is to understand that some designs have a very specific point and objective. Each and every design has. Idea wise, the design I had was cool, but it was not what I needed. In the future, I'll keep this experience at the back of my mind to cross-check my designs and why I am putting things in certain places and what the goal and purpose is of that thing I'm making.

To create this portfolio was a challenge and it went through multiple iterations to get to this final product. From the first idea till the last product, there were countless ideas, fun things tried such as different designs, which were discarded based on teacher feedback, small but difficult to implement features or part tricks such as the background 3d square animation that I couldn't make, the layouting issues that I had and the information architecture that I had. The final product thankfully became something I am happy with. The main reason is I managed to both design something minimalistic which some of my teachers liked, and I was able to structure my information somewhat well, where I managed to explain how I met the Learning Outcomes that I achieved. The last iteration is also where I added which Learning Outcomes each project helped me achieve, which was an iteration from feedback again. I wasn't sure where and how to include it, but including it at the beginning of each project seemed understandble for everyone who read the portfolio.

Interactive media products

Transferable production

Creative iterations

Professional standards

Personal leadership