SaaS Landing Page Design & Conversion

Job ID: 40381519

Budget: €250 – €750 EUR

## Project Title
**Frontend UI/UX Design & HTML Conversion — SaaS Landing Pages (Tailwind CSS / Techwind Theme)**

---

## Project Description

We are a Turkish EdTech SaaS company with a 12-year track record, serving 500+ institutional clients. We need a skilled frontend designer to create **two key landing pages** for our platform — a **Homepage** and a **Product Page** — using the **Techwind Tailwind CSS template** as the design foundation.

### What We Need

**Page 1 — Homepage (Main Website Landing)**
A modern SaaS homepage that positions our platform as a trusted, enterprise-grade solution for educational institutions. The page should communicate three core products (course automation, online exams, distance education), highlight 12+ years of experience and 500+ clients, and drive conversions (demo requests, contact).

**Page 2 — Delta Kurs Otomasyonu (Course Automation Product Page)**
A dedicated product landing page for our course management/automation product. This page should explain features, show UI previews, include pricing or CTA sections, and convert visitors into demo requests.

### Deliverables

1. **Figma Designs** — Pixel-perfect, desktop + tablet + mobile responsive designs for both pages. Organized layers, reusable components, proper typography and spacing tokens.

2. **HTML/CSS Conversion** — Clean, semantic HTML files built with **Tailwind CSS utility classes** based on the approved Figma designs. Must follow Techwind's existing patterns and component library.

### Design Foundation

We use **Techwind v3.2.0** — a Tailwind CSS multipurpose template:
- Theme preview: https://preview.themeforest.net/item/techwind-tailwind-css-multipurpose-landing-template/full_screen_preview/37847929
- We will provide full access to the purchased Techwind template files (HTML source, assets, component library)
- Your designs **must** use Techwind's existing UI patterns, components, and design language — not custom from scratch
- Reference layouts from Techwind: `index-modern-saas.html`, `index-apps.html`, `page-services.html` (we'll specify exact references upon start)

### Technical Requirements

| Requirement | Detail |
|---|---|
| CSS Framework | Tailwind CSS (as used in Techwind template) |
| No Bootstrap | Zero Bootstrap — Tailwind only |
| No jQuery | Vanilla JS only where interaction is needed |
| Responsive | Desktop, Tablet, Mobile — all breakpoints |
| RTL-Ready | Layout must not break with RTL direction (Arabic support planned) |
| Browser Support | Chrome, Firefox, Safari, Edge (latest 2 versions) |
| Language | Page content will be in **Turkish** — we will provide all copy/text |
| Icons | Remix Icon (included in Techwind) or Font Awesome 6.x |
| Images | Use placeholders; we will replace with final assets |

### What We Provide

- Licensed Techwind v3.2.0 template files (full source)
- All page copy/text content in Turkish
- Brand assets (logo, colors, product screenshots)
- Wireframes or content outlines for both pages
- Reference pages from Techwind we'd like to draw inspiration from
- Feedback within 24–48 hours on each iteration

### What We Do NOT Want

- Generic "agency template" look — this must feel like a real SaaS product
- AI-generated filler images or stock photo overload
- Heavy animations or unnecessary JS libraries
- Any CSS framework other than Tailwind
- Designs that deviate from Techwind's design system

---

## Scope & Milestones

| Milestone | Deliverable | Payment |
|---|---|---|
| **M1 — Discovery & Wireframes** | Low-fidelity wireframes for both pages (Figma) | 15% |
| **M2 — Homepage Figma Design** | High-fidelity responsive Figma design (Desktop + Mobile) | 25% |
| **M3 — Product Page Figma Design** | High-fidelity responsive Figma design (Desktop + Mobile) | 20% |
| **M4 — HTML/CSS: Homepage** | Responsive HTML using Tailwind/Techwind | 20% |
| **M5 — HTML/CSS: Product Page** | Responsive HTML using Tailwind/Techwind | 15% |
| **M6 — Final Revisions & Handoff** | Bug fixes, final polish, organized file delivery | 5% |

**Estimated timeline:** 3–4 weeks
**Revisions:** Up to 2 rounds of revisions per milestone included

---

## Required Skills

- UI/UX Design (SaaS / Landing Pages)
- Figma (component-based design, auto-layout, responsive)
- Tailwind CSS (utility-first, not just "familiar with")
- HTML5 / CSS3 (semantic, accessible markup)
- Experience with Tailwind-based themes (Techwind preferred)
- Understanding of SaaS conversion patterns (hero, features, social proof, CTA)

## Preferred (Bonus)

- Experience designing for EdTech or B2B SaaS
- Portfolio showing Techwind or similar Tailwind template customizations
- RTL layout experience
- Turkish language understanding (not required but helpful)

---

## How to Apply

Please include in your proposal:
1. **2–3 relevant portfolio pieces** — SaaS landing pages or Tailwind-based designs
2. Your experience with **Figma + Tailwind CSS + HTML conversion** workflow
3. Estimated timeline and budget
4. A brief note on how you would approach designing a SaaS homepage for an educational platform