Rhed Aligan's Blog
Activity #7: Creating a Low-Fidelity Prototype of Your Personal Portfolio | Aligan, Rhed N.

Activity #7: Creating a Low-Fidelity Prototype of Your Personal Portfolio | Aligan, Rhed N.

Rhed Aligan's photo
Rhed Aligan
·

3 min read

Hi, so this is my initial draft for my Low-Fidelity prototype personal portfolio; together with the mean of Low-fidelity design.

Low-Fidelity prototype designated to have foundation and to sight what is probably looks like our website. It's a part of initial phase of designing that the main focus is to sight the elements, layout, and alignment of each component appropriate such as features, images, toggle, and etc.

ADVANTAGES OF USING LOW-FIDELITY PROTOTYPE

  • Users Feeback - Through the user's end and experience, it is easily identified what are the things and components need to modify and align appropriate because of grid guided which helps to as designer to improve the design.

  • Risk Advance Prevention - Through the low-fidelity prototype, we prevent a potentials problem or risk from the production because we can get early to sight what are the components need to change.

  • Iterate Easily - Compared when the system is already yet to have a high-fidelity prototype or deployed in production, it's easily to change based on the shape, size, positioning without interrupting the design processes over time. It easy to navigate when all components are already settled on their own place.

  • Easy to Document - Since it's already yet the components but not in details, it's easy and convenient to document the prototype because it's not yet a detailed design.

Figure 1`.1: With Layout Grid

Figure 1.2: Without Layout Grid

In Figure 1.2 it shows the different components together with appropriate colors that I think compatible for my Low-Fidelity personal Portfolio design prototype.

In navigation bar, Includes the Logo, Toggle Menu, and Home, Skills, Skills, and Promotional Video Links. This will help audience easily understand what are in my personal portfolio.

Header and Highlights - Includes Image, Headline, skills title, and Promotional Videos of my own. It gives for audience interesting idea and cope their attention and interest to watch and watch my blog about me.

Description/ References- Together with introducing myself, adding my skills in my personal portpofio gives audience idea also opportunities for other who are interested to work with based on my skills provided. Adding credentials is most recommendable to gain more employer and organization view of Personal Portfolio.

About us - About us below the image for me is more factual matter since the website is scroll down type it's easily what in the image describe.

Every part has a designated colors, fonts used. It is very important to the website to have a good to the eyes interaction between your audience and your system.

Figure 2.1: Toggle Menu with Layout Grid

Figure 2.2: Toggle Menu without Layout Grid

Figure 2.2 shows the external or Toggle Menu of the Figure 1.2.

It includes Additional Features, The settings, and Contact.

ADVANTAGE OF TOGGLE MENU;

Space efficiency - Is one of the advantages of have a toggle menu, since if you not yet use, it behind of the button all features shown above.

Hide Unnecessary features- It hide to focus on what the context of Personal Portfolio although unnecessary but important to have features provided.

Figma Prototype Link: https://www.figma.com/proto/SsYcWJ3V3yWgy80ZstOvO7/LOW-FIDELITY-PERSONAL-PORTFOLIO?node-id=0-1&t=JZkjDhYJ5pKdOAAY-1

Figma Dev Mode Link: https://www.figma.com/design/SsYcWJ3V3yWgy80ZstOvO7/LOW-FIDELITY-PERSONAL-PORTFOLIO?node-id=0-1&m=dev&t=JZkjDhYJ5pKdOAAY-1

Thank you!

low fidelity prototype