← adnan.world
Case study · Agency work · 2025

A creative agency with no website. I designed and shipped one in a month.

Craftstudioo had clients, a team and real work, but nowhere to send a new lead. The site brought in 6 new customers in its first month.

Role
Designer
Timeline
1 month to launch, refined through 2025
Status
Offline
6 new customers in the first month after launch.

The problem

Craftstudioo had clients, a team and work to show. What it didn't have was a website, so every new lead had to take the agency at its word.

The goal: one page that answers three questions fast.

  1. 1What do you do?
  2. 2Can I trust you?
  3. 3How do I start?

The page, section by section

01

One clear next step

Five service chips show everything the agency does at a glance. "Let's Talk" is the only orange button on screen, so there's one obvious action.

Von Restorff effectHick's Law
Craftstudioo hero: five service chips and one orange "Let's Talk" button
02

Show the craft, don't describe it

I made the "WEBSITE" intro animation so the page proves the agency's skill before anyone reads a word.

Aesthetic-usability effect
The "WEBSITE" intro animation from the Craftstudioo site
03

Trust, early

Real client logos sit right under the hero, in grey, so they build trust without pulling attention from the action.

Social proof
Client logos under the hero: Vaultor, IndiaShastra, Geekster, PropGrow, FastTutor
04

Services you understand in a glance

Four image cards in a 2×2 grid. Each photo explains its service faster than a sentence, and the ↗ arrow shows it opens.

Picture superiorityCommon regionAffordance
Services as four photo cards in a 2×2 grid, each with a ↗ arrow
05

Why this agency

Three pillars, each with the same structure and one "Our Edge" line. That line answers the question every client has: why you?

ChunkingConsistency
Three pillar cards with the same structure, each ending in an "Our Edge" line
06

A form that's quick to fill

Four fields. Email and phone sit side by side because both answer "how do we reach you?" The placeholder shows what to write, so nobody stares at an empty box.

Hick's LawProximity
Contact form with four fields; email and phone side by side
07

Doubts answered before they're asked

Cost, timeline and process are answered in the FAQs, folded away so the page stays short.

Progressive disclosure
FAQ list with one answer open and the rest folded away
08

Start and end with an action

The page opens with "Let's Talk" and closes with "Get in touch". The first and last things people see are both a way to start.

Serial position effect
Footer closing with "Want to work with us? Get in touch"

One rule across the page

Orange is used only where it matters: actions, the key phrase, and the dot from the logo. Everything else stays quiet.

What happened

6 new customers in the first month after launch. I kept refining the site through 2025. Later the whole team got placed in full-time jobs, so the agency closed and the site went offline.

What the team said

“The website looks great, man. It presents our agency really well and makes our work feel more professional. And bringing in 6 clients in our first month is a solid achievement. I think the way you've presented our services has made a real difference.”
— Video Editor, Craftstudioo
“Honestly, you've done a great job with the website. It's clean, informative, and easy to understand. What I appreciate most is that your work has gone beyond design. Getting 6 clients in our first month is a great start for us, and you've played a big part in that.”
— Developer, Craftstudioo

What I learned

An agency landing page is a sales conversation. Each section has to answer the next question a client would ask, in the order they'd ask it.

Next project
GitBrief