Skip to content
WorkAboutServices
Back

Better Ask Den

A one-screen Framer portfolio arranged as cards on a wooden desk. The main card switches between work, personal information, services, templates and testimonials, with projects and contact alongside it.

View original demo
About this project Scope, process & feedback
Scope
Personal portfolio · Framer
Tools
FigmaFramerUnicorn Studio

Challenge

Fit the portfolio into a compact interface while keeping each section and the next step clear.

Solution

Used five tabs to change the main card, while the project menu and contact area remain close at hand. A yellow-and-blue portrait, drawn lettering and the wooden background connect the panels.

Delivered scope

  • One-screen Framer portfolio
  • Five navigation tabs
  • Selected project previews
  • Services, templates and testimonials
  • Shared contact area

Inside the portfolio

The original portfolio board. 5 navigation destinations. Better Ask Den design board · original interface · checked 2 Oct 2026

  • Portfolio
  • About
  • Services
  • Templates
  • Testimonials
Design boardWatch demo

The outcome

An interactive personal portfolio that brings projects, services and contact into one desk layout.

Behind the designDesign decisions, experience flow & numbers
The organising idea

Change the main card. Keep the next step close.

Portfolio, About, Services, Templates and Testimonials share the same main card area. The project menu and contact column provide a consistent frame around each view.

Experience flow

One desk, several views.

The five destinations visible in the recorded interface.

  1. 01Portfolio
  2. 02About
  3. 03Services
  4. 04Templates
  5. 05Testimonials
Archived direction

The original portfolio board, preserved.

The Better Ask Den board groups selected work, personal information, services, templates and testimonials into five navigation destinations. It records an earlier direction of the personal website.

Design boardWatch demo
Full scopeBrief, responsibilities & delivery
The brief
Bring projects, personal information, services, templates and testimonials into a one-screen portfolio.
My role
Personal portfolio design and Framer development.

What was delivered

A personal Framer portfolio with five navigation tabs and a shared project and contact area.

  • One-screen portfolio website
  • Five navigation tabs
  • Selected project previews
  • Services, templates and testimonial panels
  • Shared contact area

How it came together

  1. 1

    Used a yellow-and-blue portrait, drawn lettering and a wooden desk to establish the visual identity.

  2. 2

    Built the portfolio in Framer around five tabs: Portfolio, About, Services, Templates and Testimonials.

  3. 3

    Kept project selection and contact alongside the changing main card.

Media guide

  1. 01
    Better Ask Den — one-screen portfolio walkthroughOriginal recorded demonstration · 0:45Original post
  2. 02
    Project overviewOriginal project image
  3. 03
    Better Ask Den — Selected workFrame from the original demonstrationOriginal post
  4. 04
    Better Ask Den — AboutFrame from the original demonstrationOriginal post
  5. 05
    Better Ask Den — Services — Figma & FramerFrame from the original demonstrationOriginal post
  6. 06
    Better Ask Den — TemplatesFrame from the original demonstrationOriginal post

Reach out.

Have a website or product in mind? Let’s talk about what it needs.

Start a conversation
Hire Me on ContraChat on WhatsApp
denis@trbn.designBack to top
GalleryAll work
01 / 25
Better Ask Den — one-screen portfolio walkthrough. Original recorded demonstration.
Project overview
Better Ask Den — Selected work
Better Ask Den — About
Better Ask Den — Services — Figma & Framer
Better Ask Den — Templates
Previous projectIndustrial & RedesignNext projectBasepoint
Loading image…

A regional offer

Hello.

Let’s talk about your next website or product.

Discuss your project