Day 7: Drafting the Initial Wireframe/Mockup | Draft the initial wireframe/mockup of the website.

Goals for Day 7

  • Create a basic wireframe to outline the structure and layout of the website.
  • Focus on user-friendly navigation and professional aesthetics.
  • Wireframe Highlights

Home Page

  • Header: Logo, navigation menu (About, NGOs, CSRs, Events, Projects, Partners, Contact).
  • Hero Section: Brief intro, call-to-action buttons (Explore NGOs, Discover CSR Opportunities).
  • Featured Section: Highlights of recent projects and testimonials.

About Page

  • Clear mission statement with visuals.
  • Timeline or journey graphic (optional).

NGOs and CSRs Pages

  • Filter and search options for easy browsing.
  • Profile cards with key details (name, location, area of focus).

Events Page

  • Calendar view for upcoming events.
  • Cards for featured past events with photos and links.

Projects Page

  • Categorized listing (e.g., ongoing, completed).
  • Expanded view for each project with details and media.

Partners Page

  • Logos of partnered organizations.
  • Brief descriptions or testimonials.

Contact Page

  • Simple form for inquiries.
  • Social media links and professional contact information.

Output for Day 7

Drafted wireframe ready for review and feedback, Focused on a professional, clean design adhering to finalized branding.