Cookie settings

Choose which groups may run. Nothing you leave off is loaded. Cookie policy

  • What the site needs to work: your language and this consent record. Cannot be switched off.

    Umami

    Always on
  • Measures which pages are read and where people click. The heat map and session recording are here.

    Umami

  • Measures whether our ads work.

    No tool in this group is running right now.

Ask Paf

A brand studio’s site where the work goes first and the plan is never hidden.

Website · Brand studio: social media, ad films, web, brand identity

Visit the live site ↗
The Piktram home page: the headline over an illustrated field
The Piktram home page on a phone
PF-02 · piktram.com

PF-02 · Facts

Client
Piktram
Sector
Brand studio: social media, ad films, web, brand identity
Language
Turkish
Pages
105 in the sitemap (27 Oct 2026)
Built with
React, prerendered to static HTML; self-hosted Outfit type
Publishing
From the studio’s panel, one button per release

Piktram is a brand studio that runs social media, ad films, websites and brand identity for its clients. Its site has to show the work, explain each service as a plan, and stay current without a developer at every change.

Projects and guides are written in the studio’s own panel; one button rebuilds the site and ships it, and a build that fails never touches the live site.

  • Website
  • Projects
  • Service pages
  • Sector pages
  • Blog
  • Publishing from a panel
  • Search and answer engines

In numbers · each with its source

  • 105pages in the sitemaphome, services, projects, sectors, guidessitemap.xml, read 27 Oct 2026
  • 17project pageseach with its own case pagesitemap.xml, read 27 Oct 2026
  • 16sector pagesservices told in each sector’s termssitemap.xml, read 27 Oct 2026
  • 49guides on the blogwritten and published from the panelsitemap.xml, read 27 Oct 2026

The site, running

The home page, as it runs today. Recorded on the live site.

The projects are on the home page before anything is explained.

/01 The work first

Recent work sits high on the home page as large picture cards, each tagged with its service. The projects page filters the same cards by service, and every card opens its own page.

Seventeen project pages are in the sitemap today, written and published from the studio’s own site panel.

The projects page: cards filtered by service
Projects
The projects page on a phone
Projects on a phone

Every service is told as a plan: scope, calendar and budget up front.

/02 Services as plans

Four services, social media, ad films, web design and brand identity, each have their own page with the process and the price. Web design has three deeper pages: search, speed, and answer engines.

A job’s journey is drawn as steps on the home page, from the first call to delivery, with the tools used at each step.

Services: every job has a plan
Services
The web design service page
Web design
A job’s journey, drawn as steps on the home page
A job’s journey

Sixteen sector pages and forty-nine guides, for the reader who searches first.

/03 Sectors and guides

Each sector page tells the same services in that sector’s terms, from coffee to clinics, and links the projects that fit it.

The blog groups its guides by service. A new guide is written in the panel and goes live with the next publish.

Services by sector
Sectors
The blog: notes from the studio
Guides

The page is there before the script runs.

/04 Built to be read

Every page except the labs is drawn to HTML at build time, so the headline is in the first bytes a browser or a crawler reads; React takes over in the browser. The type is served from the site itself, with no third-party font request.

The build also writes a sitemap, structured data, an llms.txt and an AGENTS.md at the root, so search engines and answer engines read the studio the way it describes itself.

One panel for every job: plan, approvals and reports
One panel
The page about the studio’s own panel
The panel page

The same pages in one column, the first screen kept for the headline and the work.

/05 On the phone

On a phone the home page keeps its headline, the two doors and the work cards in the first screen. Service and project pages stack into a single column.

The blog keeps its service filter on the phone as a row of chips above the first guide.

The home page on a phone
Services on a phone
The web design service on a phone
The blog on a phone

Page types

One screen of each kind of page, from the live site.

  • Home page
    Home
  • What we do: four services
    What we do
  • Recent work on the home page
    Recent work
  • A sector page: coffee brands
    Sector page
  • Questions
    Questions
  • About the studio
    About
  • Contact: meet in 15 minutes
    Contact
  • The panel page
    Panel

What shipped

  1. 01A home page that leads with the work, then the plan, the services and a job’s journey
  2. 02Four service pages and three deeper web pages: search, speed, answer engines
  3. 03Seventeen project pages, filtered by service
  4. 04Sixteen sector pages
  5. 05A blog with forty-nine guides, grouped by service
  6. 06Projects and guides written in the studio’s panel, published with one button
  7. 07Pages drawn to HTML at build time, with a sitemap, structured data, llms.txt and AGENTS.md
The whole Piktram home page, top to bottom
The whole home page. It scrolls inside the window as you read.

Credits

Built by the Paftane team.

Visit the live sitepiktram.com ↗
Next real project · PF-01 · WebsiteOrtac Global
The Ortac Global home page: the headline, with work notices moving past while the photo changes city
Three countries, two languages, 144 pages: one clear site for an advisory firm.

Tell Paf what you have in mind.

or tell us about your project

Request a call time

Pick a time that suits you. A person confirms it by email within 2 working days.

Day
Time · GMT+3

Or write to [email protected]