Skip to content

WEB_GUIDE.md

Latest commit

 

History

History
71 lines (46 loc) · 2.46 KB

WEB_GUIDE.md

File metadata and controls

71 lines (46 loc) · 2.46 KB

Prasuco.com – Website Guide

About Prasuco

Prasuco is a product lab created by a group of friends hacking around together, focused on developing open-source applications and client projects. Our work spans:

  • In-house apps like Hindu Devotion, Kids Learning, etc.
  • Client projects leveraging modern technologies.

Our mission: Craft better end-user software that is free, open-source, and easy to use.

Technology Stack

See README.md for full details on the stack. (Recommended: TailwindCSS, Astro/React, and modern JS/TS tooling.)

Website Structure & Pages

The site should have a minimal, clean structure with light background.

Core Pages:

  1. Home (/) – Intro to Prasuco, mission, featured projects.
  2. Projects (/projects) – List of all projects.
  3. Project Detail (/projects/:slug) – Individual project page with description, tech stack, and repo link.
  4. Blogs (/blogs) – List of all blogs/articles.
  5. Blog Detail (/blogs/:slug) – Individual blog post.
  6. Contributors (/contributors) – Showcase contributors and collaborators.

Design Principles

  • Minimal & Clean: Avoid clutter; emphasize content and readability.
  • Light Mode Only: Soft, neutral background for better user comfort.
  • Brand Colors: Use only TailwindCSS colors defined in the project; avoid harsh tones.
  • Typography: Simple, readable fonts; headings should be distinguishable but not bold/overpowering.
  • Spacing: Generous padding/margins to create airy layouts.
  • Responsive: Fully mobile-friendly; flexible grid/list layouts for projects and blogs.
  • Interactive Elements: Subtle hover effects, links clearly visible without being flashy.

Development Guidelines

  • Use TailwindCSS for theming and layout.
  • Keep components modular and reusable.
  • SEO-friendly URLs: /projects/:slug, /blogs/:slug.
  • Lightweight assets and optimized images for fast load times.
  • Optional: Use Satori or ReSVG for dynamic OG images with logo.

Suggested Minimal Layout

Home Page Example Sections:

  1. Hero section with a short mission statement.
  2. Featured projects carousel/grid.
  3. Latest blogs snippet.
  4. Quick links to contributors or GitHub repo.

✅ Goal: A minimal, elegant, light-themed website that communicates Prasuco’s product lab identity clearly and encourages users to explore our open-source projects.