Mohammadreza Talebi

SaeedFargah.ir

A bilingual editorial portfolio for an automotive designer, pairing large-format visual storytelling with a private, fail-closed Design Studio entry.

View live siteExplore the project

By Mohammadreza Talebi · 6 min read

saeedfargah.ir
Automotive designer introduction · Live website capture
Year
2026
Role
Product / Next.js development
Scope
Next.js · TypeScript · RTL
Status
Live

The project, in context

I designed and developed Saeed Fargah's bilingual portfolio to give automotive and industrial work room to be understood. The Next.js website combines selected concepts, a career timeline, a detailed Golden Falcon presentation, architectural work and a Design Studio preview. Large imagery leads the experience, while restrained typography, responsive layouts and consistent Persian and English routes keep the story readable.

A visual portfolio with enough context

The source material spans automotive concepts, vehicle-body studies, marine design and architectural systems. Presenting it as a uniform grid would flatten the differences between projects. I needed a hierarchy that gave the form and proportions of each work enough space, while making the designer's background and the relationship between disciplines easy to follow.

The Persian and English experiences also needed to feel equally intentional. A dark cinematic interface can quickly become difficult on a phone if titles, captions and overlays are designed only for desktop. Project claims needed careful wording as well: a concept render, a physical build and a manufacturing proposal do not describe the same stage of work.

One editorial journey across disciplines

I built a dark editorial system with gold accents, generous images and concise captions. The page begins with the designer and selected work, then moves through the professional timeline, Golden Falcon, Fargah Design and the studio. These sections create a sequence without forcing the audience to read a long biography before seeing a project.

The implementation uses reusable React sections and language-specific routes. Persian changes direction and type, not just copy. Motion adds emphasis through section reveals and project-panel transitions, with reduced-motion handling where those interactions are implemented. Metadata, person schema, language alternates and the sitemap establish the site's identity, while the studio's generation capability remains an explicitly controlled preview.

What I built

The parts that make this project useful in day-to-day work.

  1. Selected-work presentation

    The showcase gives Golden Falcon, Aventador SF and Dragon Concept distinct visual panels. Focus and hover states add emphasis while the project's title, year, status and short explanation stay connected to the image. This makes the work legible without reducing it to a thumbnail.

  2. A readable professional timeline

    A timeline connects earlier vehicle concepts, physical development and later cross-disciplinary work. It provides background after the visual introduction and gives the portfolio a narrative structure rather than leaving visitors to infer chronology from image filenames.

  3. A deeper Golden Falcon section

    The Golden Falcon section includes a technical concept view, an exterior study and an interior presentation. Captions distinguish the angle and intention of each image so the section explains the proposal beyond one promotional render.

  4. A link to architectural work

    A dedicated Fargah Design section shows how the designer's work extends into modular facade systems and built-project references. The link to the company website offers a separate route for visitors whose interest is architecture rather than automotive design.

  5. Persian and English as full layouts

    Language-aware routes, navigation and type choices give Persian a real RTL layout and English a clear LTR reading flow. Canonical and alternate-language metadata connect those versions without relying solely on a client-side text replacement.

  6. Responsive imagery and motion

    Desktop compositions and compact layouts use different spacing and image treatment. Motion guides attention through project and section transitions, and implemented reduced-motion controls offer a quieter alternative. Contact remains available through direct email and the designer's public professional channels.

From structure to release

  1. Curate the material

    I organised the supplied project material into selected work, career context and detailed studies. Each image needed a role in the story, and each project needed wording that reflected its actual status.

  2. Build the visual rhythm

    I established the dark palette, gold details, large-format panels and reusable section patterns, then connected those patterns to the bilingual content. The section sequence lets imagery and explanation share the page without competing continuously.

  3. Carry the design into the product

    The implementation brought route-based language handling, metadata, responsive sections and controlled studio availability into the same project. The studio remains a preview with explicit enablement, so the public portfolio can stand on its own.

Delivery and current scope

  • A bilingual Next.js, React and TypeScript portfolio with independent Persian and English routes.
  • Selected work, a professional timeline and a multi-view Golden Falcon presentation.
  • Reusable visual sections, responsive layouts and project-oriented motion.
  • Person metadata, language alternates, sitemap and direct contact paths.
  • A Design Studio preview with separately controlled image-generation availability.

Questions about this project

Did you create the automotive designs shown here?

The automotive, marine and architectural works are Saeed Fargah's portfolio material. My contribution is the website's product design, interface, visual presentation, bilingual implementation and web development. The case study keeps those responsibilities distinct.

Why build it with Next.js?

The portfolio has reusable visual sections, route-specific language metadata and a separate studio interface. Next.js and TypeScript provided a coherent structure for those needs, with React components keeping the visual system consistent as the content changes.

Is the Design Studio an unrestricted public generator?

No. The project presents the studio as a preview, and generation depends on an enable setting and a server-side provider key. The website does not imply that rendering is available to every visitor at all times.

Have a similar project in mind?

Tell me what you need to build and where the current experience falls short.

Start a conversation+989304330645
Next projectNABZ Capital