Design portfolio glossary

Key design and portfolio terms explained clearly. Everything you need to understand when building and managing your design portfolio online.

A B C D E F G H I L M P R S T W

A

Above the fold

The visible area of your design portfolio before a visitor scrolls. Place your strongest project and a clear value proposition here. Creative directors often decide within seconds whether to keep looking.

Alt text

A written description attached to an image for accessibility and search indexing. Describe the project and deliverable so search engines can catalog your design work and screen readers can convey it to all visitors.

Art direction

The practice of guiding the visual tone, style, and narrative of a creative project. Art directors oversee how design elements work together to communicate a cohesive message across media.

Aspect ratio

The proportional relationship between an image's width and height. Common ratios like 16:9, 4:3, and 1:1 affect how project visuals display in different gallery layouts and on various devices.

B

Brand identity

The complete visual system that represents a company or individual — logo, color palette, typography, imagery style, and tone of voice. A core deliverable for many graphic and brand designers.

Bounce rate

The percentage of visitors who leave your design portfolio after viewing only one page. If your bounce rate is high, your landing page may not be engaging enough or your navigation may be unclear.

Breakpoint

A specific screen width where your portfolio layout adapts to a different arrangement. Common breakpoints target mobile, tablet, and desktop screens to ensure your work looks sharp everywhere.

C

Case study

A detailed presentation of a design project that walks through the brief, research, process, decisions, and final outcome. The backbone of any serious design portfolio — it shows how you think, not just what you produce.

Color system

A structured set of color values used consistently across a brand or product. Includes primary, secondary, and neutral palettes with defined usage rules for accessibility and visual harmony.

Creative brief

A document outlining the objectives, audience, deliverables, and constraints of a design project. A well-written brief aligns designer and client before any creative work begins.

Custom domain

A unique web address like yourname.com or yourname.design that replaces the default subdomain. Essential for designers who want to present a professional, memorable online presence.

Client work

Design projects completed for paying clients, as opposed to personal or speculative work. Featuring real client work in your portfolio demonstrates that you can deliver within real-world constraints and deadlines.

D

Design system

A comprehensive collection of reusable components, patterns, and guidelines that ensure consistency across a product or brand. Increasingly requested by companies hiring product and UI designers.

Digital download

A file delivered electronically after purchase. Designers sell UI kits, icon sets, font files, and templates as digital downloads through their portfolio store.

Design thinking

A human-centered problem-solving framework that moves through empathy, definition, ideation, prototyping, and testing. Widely used in UX and product design to arrive at solutions grounded in user needs.

E

E-commerce

The ability to sell products or services online. For designers, this means selling digital assets, prints, or creative resources directly from your design portfolio with no middleman.

Experiential design

Design that shapes physical or digital environments to create meaningful user interactions. Spans exhibition design, spatial branding, interactive installations, and immersive digital experiences.

F

Favicon

The small icon displayed in the browser tab beside your page title. Upload your logo mark or a custom symbol to give your design portfolio a polished, finished feel.

Font pairing

The practice of selecting two or more typefaces that complement each other. A strong combination typically pairs a distinctive display font for headings with a readable body font for text.

Full-bleed

A visual that extends to the very edges of the page with no margins. A popular layout approach in design portfolios to create immersive, gallery-like presentations of project work.

G

Gallery

A page or section that displays a collection of visual work. The foundation of every design portfolio. Portfoliobox offers a wide range of gallery layouts including grids, masonry, slideshows, and lightbox views.

Grid system

An underlying structure of columns, rows, and gutters that organizes content on a page. Grids create visual order and consistency — fundamental to both graphic design and web layout.

H

Hero image

The large, prominent visual at the top of a page. In a design portfolio, your hero image sets expectations instantly — choose a compelling project visual that represents your strongest work.

Hierarchy

The arrangement of visual elements to guide a viewer's attention in order of importance. Achieved through size, contrast, color, spacing, and typography. Critical in both design work and portfolio presentation.

HTML/CSS

The foundational languages of the web. HTML structures content, CSS controls appearance. Understanding these basics helps designers communicate with developers and make informed decisions about their portfolio layout.

I

Information architecture

The structural design of how content is organized, labeled, and connected within a website or application. Good IA ensures visitors find what they need quickly — applies to both your portfolio and your UX project work.

Image optimization

Reducing file size while preserving visual quality so pages load quickly. Crucial for design portfolios that rely on high-resolution project imagery to make an impression.

L

Lightbox

An overlay that displays an enlarged version of an image on top of the current page. Useful in design portfolios for letting visitors examine project details at full resolution without navigating away.

Layout

The arrangement of text, images, and other elements on a page. In portfolio context, your layout choices communicate your design sensibility before a visitor even reads a word.

Logo

A visual mark that identifies a brand or individual. Often the centerpiece of brand identity projects and one of the most commonly featured deliverables in graphic design portfolios.

M

Masonry layout

A gallery arrangement where items of varying heights stack efficiently like brickwork. Well suited for design portfolios that include work in different aspect ratios and orientations.

Meta tags

HTML data that tells search engines what your page is about. Include relevant terms like 'brand designer' or 'UX portfolio' in your meta titles and descriptions to help the right people discover your work.

Mockup

A realistic visual representation of how a design will appear in context — on a device screen, product packaging, or physical environment. Mockups bring case studies to life and help clients visualize the end result.

P

Portfolio curation

The deliberate process of selecting and sequencing projects for maximum impact. A curated design portfolio with five strong case studies outperforms a cluttered collection of twenty mediocre pieces.

Process documentation

Visual and written records of your design journey — sketches, wireframes, explorations, iterations, and rationale. Including process work in your portfolio demonstrates depth of thinking beyond polished finals.

Prototype

An interactive simulation of a design that lets users click through flows and test interactions before development begins. Tools like Figma and Framer produce prototypes that can be linked from your portfolio.

R

Responsive design

A website that adapts its layout and content to different screen sizes and devices. Essential for design portfolios — potential clients and employers browse on phones, tablets, and desktops.

Rebrand

The process of overhauling a company's visual identity, messaging, or market positioning. Rebrand projects make compelling case studies because they involve strategic thinking alongside visual execution.

Raster vs vector

Raster images (JPG, PNG) are made of pixels and lose quality when scaled up. Vector graphics (SVG, AI) use mathematical paths and scale infinitely. Understanding the difference matters for both project work and portfolio optimization.

S

SEO

Search Engine Optimization. For designers, this means using relevant keywords, descriptive alt text, clean URLs, and structured meta data so potential clients and recruiters can find your design portfolio through search engines.

Style guide

A reference document defining the visual and verbal rules of a brand — colors, typography, spacing, tone of voice, logo usage. A common deliverable in branding projects and valuable portfolio content.

Slideshow

A gallery layout that presents images one at a time with transitions between them. Effective for walking visitors through a design process or presenting a project in a controlled, sequential narrative.

SSL certificate

Security encryption between your portfolio and its visitors. Shown as the padlock icon in the browser address bar. Included automatically with all Portfoliobox plans at no extra cost.

T

Template

A pre-designed portfolio layout you customize with your own projects and content. Portfoliobox offers templates with clean grids and generous whitespace that let design work take center stage.

Thumbnail

A small preview image representing a project in a gallery grid. Consistent, well-crafted thumbnails make your design portfolio feel cohesive and intentional at first glance.

Typography

The art and technique of arranging type. Encompasses font selection, sizing, spacing, and hierarchy. Typography is both a fundamental design skill and a key element of how your portfolio itself communicates.

W

Watermark

A semi-transparent overlay on images used to deter unauthorized reproduction. Some designers watermark work-in-progress visuals shared online while keeping portfolio presentations clean.

Whitespace

The empty space between and around elements on a page. Also called negative space. Generous whitespace in a design portfolio lets each project breathe and signals visual confidence.

Workflow

Your end-to-end process from receiving a brief to delivering final assets. Includes research, ideation, iteration, client feedback, and handoff. A well-defined workflow makes you more efficient and your portfolio more compelling.