As a part of this creative entrepreneurship module, I have an online portfolio. A portfolio is a catalogue of a practitioners most successful projects to be shown to potential employers and clients. This portfolio also provides viewers with an insight into the processes and techniques I have used to achieve a final outcome.
During the project, I aimed to create a webpage which successfully displays my favourite projects in a clear and concise written structure. While designing this portfolio, I also explored how I could create a website that is visually interesting and easily navigated.
Before beginning to design a webpage portfolio, I explored current portfolios used by those in a variety of design practices to promote and display their work. It was useful to stud how different designers utilised features like navigation bars, buttons and grid layouts to create clear and engaging website portfolios.
(above) HeyDays Portfolio utilises a rich, consistent colour palette and interesting content structure which gradually reveals itself
(above) Designer Aaron Rolston’s portfolio utilises an intersting structure which allows projects to expand on the same screen as the homepage
It was also exciting to view how these practitioners were able to effectively project their design style and personality through branding elements like logos, typography and navigation. It was also useful to note that most portfolio’s I found successfully sold their products, prioritised imagery and were not afraid to have mockups and imagery take up the majority of the screen. Having already established a personal brand, I found a minimalist layout which showcases my example work clearly is important to representing myself as a designer.
After gathering inspiration from existing portfolios and studying fundamental design techniques like visual hierarchy, I began to start sketching out different potential portfolio concepts. I have included wireframe sketches below which highlight how I plan to structure the webpages. I liked the concept of utilising section navigation to keep the user within the one page an enhance the clarity of the experience.
I began to adapt my sketches into wireframes on Figma where I was able to test creating sections on Figma to keep all features on one homepage. I also began to explore visual hierarchy through typography to highlight important elements e.g., “Read More” links.
(above) Low Fidelity wireframes
(above) Applying project images etc. to wireframes
At this point in the development, I also began to create project pages with summary explanations of important stages of the UX design process which I utilised to create an outcome. I created header images for each project which highlights the final outcome before guiding the user through the UX process in an interesting and clear storyline.
(above) Example of header image
(above) Example of header image
(above) Project page
(above) Project page
I have included a link to my current web portfolio below, creating using WebFlow. Currently, I am working on adding more projects to this portfolio and including features like a contact page which allows potential employers to easily get in touch!