UI: High-fidelity Mockup - Homepage

[mtreacy002]

Description

As a student,
I need to create high-fidelity mockup for Homepage,
so that I can move forward with on the planning stage.

Mocks

as per initial proposal:

Acceptance Criteria

Update [Required]

• About BridgeInTech section
• Recent mentoring opportunities section
• Contact form section
• Contact details section

Definition of Done

• All of the required items are completed.
• Approval by 1 mentor.

Estimation

1 day

[mtreacy002]

Update:

Here's the Landing (Homepage) Mockup I have in mind. There are 3 internal sections on this Homepage:

1. About section

2. Benefit section

3. Recent Programs section

On Recent Programs section, the arrow at the end of each programs when clicked, will open to a brief program description as below:

link to file

[isabelcosta]

@mtreacy002 I really love the mockups, it's so much realistic and relatable 🤗

[mtreacy002]

Thanks, @isabelcosta. As per your suggestion, I'll keep the Homepage as static page for the MVP. Meaning that the Recent Programs section will be for Future Feature 😉

[mtreacy002]

Just wanna take notes on possible Reusable components based on the Homepage mockup:

• Public/Non Logged-in users Main-navbar

• Logged-in users Main-Navbar - Not representative of an organization

• Logged-in users Main-Navbar - representative of an organization

• down/up arrows at the bottom of the Homepage

• Sub-Navbar for Homepage

[mtreacy002]

Also, I've updated the Homepage to the followings:

• About page

• Benefit page

Note that the tabs inside Main-Navbar will depend on whether user is logged-in or not.