A website prototype is a draft layout: where the headline, form, pricing, and cases sit, and how users move between screens. No colours, photos, or wow animations — but meaningful copy and clear buttons. At NUGU prototyping is mandatory between the brief and design: you approve sales logic, not argue about shades of blue.
Why spend time on a prototype
**Budget savings.** Moving a block on a wireframe takes 10 minutes. Redrawing a final mockup and rebuilding front-end takes hours and extra cost.
**Focus on the job.** At prototype stage you see if "About us" fills half the screen and CTA is missing on mobile. Design only masks that.
**Shared language with the client.** Not everyone reads a website specification the same way. Screen schemes are clear to marketing, the director, and sales.
**Foundation for content.** Prototypes fix headlines and text volume per block — copywriter or client knows what to write.
Types of prototypes
**Low-fidelity.** Rectangles, lines, labels "photo", "form". Fast, for first approval of sales-focused structure.
**Mid-fidelity.** Real or draft copy, heading hierarchy, form fields, menu items.
**Interactive.** Button click leads to the next screen — good for testing home → service → enquiry.
**High-fidelity** is close to a mockup — only for complex products with unique UI.
For most SMBs in Sochi, mid-fidelity on 5–15 screens is enough.
Prototype workflow at NUGU
- **Brief and goals** — one main action, audience, competitors.
- **Page map** — URL list and purpose of each page.
- **Wireframes of key screens** — home, services, typical service, contacts; for landing — all blocks in order.
- **1–2 approval rounds** — structure changes, not decoration.
- **Handoff to design** — prototype = spec for UI designer and developer.
Timeline: 2–5 business days for a landing, up to two weeks for a corporate site with a dozen templates.
What every page prototype should include
- Heading hierarchy H1–H3 (draft).
- CTA placement: button, phone, messenger.
- Trust blocks: reviews, numbers, client logos.
- Form: fields, button text, post-submit state.
- Footer: contacts, legal links, map if needed.
- Mobile behaviour: block order often differs from desktop.
Prototype vs straight to design
| Approach | Pros | Cons | |----------|------|------| | Prototype first | Cheaper changes, clear structure | +3–7 days at start | | Straight to design | Faster "see the beauty" | Expensive rework, decor debates instead of logic |
If a vendor skips prototyping and draws "like on Pinterest" — you risk a site you like that does not convert.
Common prototyping mistakes
- Approving without whoever handles enquiries — form is "inconvenient" later.
- Copying a competitor structure one-to-one without your funnel.
- Leaving Lorem ipsum until design — no sense of text overflow.
- Forgetting states: form success, empty catalogue, long menu.
- Not checking prototype on phone — half the Sochi audience is mobile.
Prototype and development
Developers get prototype + UI kit. Fewer "what goes here" questions. For turnkey website development this shortens acceptance.
Interactive prototypes can go to usability tests: 3–5 target users run the scenario — cheaper than testing after launch.
Cost
NUGU rarely sells prototyping alone — it is part of the development package. Full project guide:
- landing — from 30 000 ₽;
- service site — from 50 000 ₽;
- corporate — from 80 000 ₽;
- online store — from 140 000 ₽;
- Quick Start — 35 000 ₽ in 7 days (simplified prototype + launch).
Prototype approval checklist
- Customer path from entry to enquiry is clear without explanation.
- Every key screen has a next step.
- Headlines reflect the offer, not "welcome".
- Form is not overloaded with fields.
- Mobile version reviewed separately.
- Legal pages and 404 not forgotten.
- Sales team confirmed blocks answer their typical questions.
Prototype for different site formats
**Landing.** Prototype is one long scheme with anchors. Approval takes 1–2 days with a ready offer.
**Service site.** Separate wireframes for home, service catalogue, and typical service page. A reusable template saves time: new service = new copy in the same grid.
**Corporate.** We prototype About, Careers, Partners only if they affect sales. The rest is phase two.
**Online store.** Product card, catalogue with filters, cart, checkout — separate screens with in-stock / pre-order states.
How the client participates
Before the call prepare: service list, prices or ranges, 3–5 customer questions, examples of sites where you like the logic. At prototype approval decide "what goes where", not "which font". One approver on your side — otherwise revisions drag on for weeks.
When to contact NUGU
New site, redesign, or ad landing — start with prototyping as part of the project. In Sochi we build wireframes in Figma, run an approval call, and only after your OK move to visuals.
Leave an enquiry via contacts: describe the task, send your current site URL — we will show how the prototype stage fits your quote.
Prototype and project timeline
A clear prototype shortens overall development: the designer is not waiting for "where to put the block", the developer sees all screen states. For a landing from 30 000 ₽ the typical cycle is 2–3 weeks from brief to launch; for a service site from 50 000 ₽ — 3–5 weeks. Delays more often come from an unapproved prototype than from front-end work.