Rebekah Leonard Portfolio


I started off looking at examples of existing portfolios to get an idea of the different portfolio structures and what companies or individuals have included in their portfolios so I can establish what feature I like and dislike and can apply it to the development of my own portfolio.

Researching Existing Portfolios

Sketching

After looking at some examples of existing portfolios, I started sketching out some ideas for how I would like my portfolio to look. I am only going to use one screen for my main portfolio with each project screen branching off it and use a navigation bar to bring you to different areas of the page. This is because employers aren't there to spend a long time on your portfolio so having it all on one screen with a simple navigation allows less searching and links to click.

Scan 22 Dec 2023 at 14.48 page 1.jpeg

Scan 22 Dec 2023 at 14.48 page 3.jpeg

Scan 22 Dec 2023 at 14.48 page 2.jpeg

Scan 22 Dec 2023 at 14.48 page 5.jpeg

Scan 22 Dec 2023 at 14.48 page 4.jpeg

Once I had sketched a few ideas for the home screen, I then started to sketch some ideas for how I would like my project screens to be laid out and look. I wanted to continue to include the contact footer and the navigation bar on each page.

Scan 22 Dec 2023 at 14.48 page 6.jpeg

Scan 22 Dec 2023 at 14.48 page 7.jpeg

Creating Wireframe

I then started using all the ideas to create a basic layout on Figma of how I would like my portfolio website to look. This was the wireframe I chose to create from my sketches. I picked to use this layout as I felt it displayed the information I was trying to get across best but also looked very presentable.

Untitled

Untitled

Creating Project Pages In Figma

l then developed the wireframe by adding in the content such as the mock-ups and contact information and ended up changing the design a little bit. I ended up lighting the shades of grey a little bit and changing the boxes which each project was displayed in to be rounded and a little bit more spread out and creates a better look and flow.


Content Written For Case Studies

Case Study Planning