MarvelVS Creative Have a project? ↗

SELECTED WORK / THE IDEA AND THE DETAILS

Five businesses.
Five ways in.

A website is one piece of the work. Here’s how identity, useful information and a clear next step come together across five different concepts.

Self-directed work for fictional businesses. The designs and working demonstrations are portfolio examples, with no client affiliation or measured business results claimed.

Explore all five websites, working experiences & supporting materials ↗

01

RESTAURANT / WEBSITE, MENU & PROMOTION

Mango & Smoke

Explore the full concept ↗

One restaurant. One connected impression.

Bring Filipino food, American barbecue and generous hospitality into one recognizable restaurant concept. Give a hungry visitor useful places to go after the first impression.

The work
Website direction, category-led menu, food imagery and coordinated promotional artwork.
The decision
A dark food-led website, a warmer printed menu and mango accents hold the different formats together. Promotions carry the same identity, with a clear occasion and a destination.
Mango & Smoke signature dish concept
MANGO & SMOKE / THE DIRECTIONFilipino roots.
Slow-smoked soul.

A food-led identity that carries from the first screen to the menu and the next promotion.

Food imagery, palette and the connected restaurant direction.See the website presentation ↗
  1. Start with the food.

    The signature dish establishes the appetite and the point of view. Menu categories let the visitor explore beyond the hero image.

  2. Give the visit an occasion.

    Happy-hour artwork extends the identity into a reason to return. Sample times are clearly part of the fictional concept.

  3. Connect the working pieces.

    The connected-launch study puts the website, menu, social posts, captions and opening checklist beside one another.

OPEN THE PROJECT FILE / 01What would a useful handover contain?

The working notes.

  • Keep a single approved source for dishes, prices, ingredients and allergen wording.
  • Match the website, profile and poster before changing a promotion.
  • Confirm final hours, location, ordering and booking arrangements before a real launch.

The review priorities.

  • Check that menu categories are readable on a phone.
  • Check every promotion against the approved dates, times and destination.
  • Review food descriptions and final print files with the business owner.
View the sample project file ↗PDF · 2 pages · A self-directed portfolio example

Explore the polished website & signature experience ↗ Supporting materials ↗

02

VENUE / WEBSITE, EVENT CREATIVE & MERCHANDISE

Red River BBQ

Explore the full concept ↗

Food and live music, sharing the same stage.

Make a barbecue and music venue feel like one destination. A visitor should understand the food, the atmosphere and the reasons to come back, without searching through separate stories.

The work
Venue website, menu and music presentation, courtyard art direction and merchandise mockups.
The decision
Warm copper tones, a strong editorial headline and courtyard imagery connect the menu with the energy of a night out. The identity also has enough character to carry onto apparel.
Red River BBQ courtyard conceptRED RIVER BBQ / AUSTIN CONCEPTSmoke.
Sound.
Saturday.
A COURTYARD
KIND OF EVENING.
Fictional event direction
No live event or ticket offer
Red River BBQ uniform and merchandise mockups
Courtyard art direction, event treatment and merchandise mockups.See the website presentation ↗
  1. Set the scene.

    A courtyard performance makes the venue’s personality visible before the visitor reads a long introduction.

  2. Offer two clear ways in.

    Menu and live-music links serve different visitor intentions. Each has a visible place in the navigation.

  3. Carry the identity beyond the screen.

    The merchandise artwork shows how the same direction could extend to the team and the venue’s physical presence.

OPEN THE PROJECT FILE / 02What would a useful handover contain?

The working notes.

  • Treat event details as their own content: title, date, doors, location and next action.
  • Keep illustrative event examples separate from any real ticket or reservation service.
  • Use the approved artwork and final supplier specifications for any physical merchandise.

The review priorities.

  • Find the menu and music sections from the first screen.
  • Read an event announcement for what, when, where and the next step.
  • Check artwork placement and legibility at the actual print size.
View the sample project file ↗PDF · 2 pages · A self-directed portfolio example

Explore the polished website & signature experience ↗ Supporting materials ↗

03

SALON / WEBSITE, PROFILE & STATIONERY

Chroma Hair Studio

Explore the full concept ↗

Expressive on the surface. Clear underneath.

Give a salon a recognizable visual identity while helping a first-time visitor understand the services and describe the change they have in mind.

The work
Salon website, service presentation, consultation preview, stationery mockups and social profile direction.
The decision
Portraits and a violet palette establish the personality. Service information and the consultation preview give that personality a useful next step. The stationery and profile keep the same visual vocabulary.
Chroma portrait campaign conceptCHROMA / THE STUDIO EDITA little
color.
A lot
of you.
COLOR · CUT · YOUR NEXT CHAPTER
Chroma business-card and stationery concept
Campaign direction, business cards and stationery.See the website presentation ↗
  1. Let the personality lead.

    Portraits, color and editorial type establish the studio’s visual direction.

  2. Make the choices understandable.

    Service descriptions and indicative CAD prices help the visitor compare starting points.

  3. Turn interest into a conversation.

    The consultation preview helps someone organize a service choice and an idea before speaking with the studio.

OPEN THE PROJECT FILE / 03What would a useful handover contain?

The working notes.

  • Keep service names and indicative prices consistent across the website and profile.
  • Use a concise bio and one useful profile destination rather than a collection of competing links.
  • Provide agreed artwork, post templates and usage notes; account verification stays with the owner.

The review priorities.

  • Compare the first impression across website, stationery and social profile.
  • Read service descriptions without relying on the photography.
  • Review the consultation summary for the choices someone actually made.
View the sample project file ↗PDF · 2 pages · A self-directed portfolio example

Explore the polished website & signature experience ↗ Supporting materials ↗

04

STUDIO / ART DIRECTION & CONSULTATION EXPERIENCE

Black Lantern Tattoo

Explore the full concept ↗

Let the artwork speak. Help the conversation begin.

Give detailed artwork the space it needs, while making the first inquiry feel approachable. The visitor needs a way to put an idea into words before any real studio conversation.

The work
Studio website, artwork presentation, process information and a sample consultation-brief interaction.
The decision
Charcoal, bone and oxblood tones frame the artwork with restraint. The consultation flow breaks a large open-ended request into smaller, more useful choices.
Black Lantern Tattoo artwork conceptYour story.
Written in ink.
BLACK LANTERN / A CONVERSATION STARTER

An idea,
worth understanding.

A useful first brief makes room for the person and the artwork.

01
The visual direction

What style or references help describe the idea?

02
The placement

Where is it intended to sit, and what should the artist understand?

03
The scale

What starting size would you like to discuss?

Sample consultation structure. The website demo lets a visitor preview their choices; this specimen is not a client record.
Artwork presentation and the structure behind a first consultation.See the website presentation ↗
  1. See the visual direction.

    Artwork establishes the studio concept’s personality without competing with a wall of promotional text.

  2. Understand the process.

    Supporting copy explains how an idea becomes a conversation, with questions and next steps close at hand.

  3. Build a starting brief.

    The demo brings style, placement and size choices into a summary to review. It does not make a real booking.

OPEN THE PROJECT FILE / 04What would a useful handover contain?

The working notes.

  • Keep artist-approved process information separate from the illustrative artwork.
  • Treat a generated consultation summary as a conversation starter, not a quote or final design.
  • Agree ownership, privacy, storage and follow-up before connecting any real inquiry system.

The review priorities.

  • Check that each artwork crop preserves the subject.
  • Review the brief with different combinations of style, placement and size.
  • Make the difference between a preview and a real appointment explicit.
View the sample project file ↗PDF · 2 pages · A self-directed portfolio example

Explore the polished website & signature experience ↗ Supporting materials ↗

05

TRAINING / PROGRAMS, SCHEDULE & FIRST-VISIT FLOW

Iron Tide Martial Arts

Explore the full concept ↗

A strong identity. A more approachable first step.

Balance the energy of training with the practical information a new student needs. Help someone explore disciplines, understand the sample schedule and describe a useful starting point.

The work
Training website, program descriptions, filterable sample schedule and class-introduction preview.
The decision
Graphite and cyan bring a focused training identity to the page. Clear program choices and a filterable schedule turn that energy into information a newcomer can use.
Iron Tide training conceptFind your footing.
Build your next level.
IRON TIDE / A CHICAGO TRAINING CONCEPT
PROGRAM DISCOVERY / A CLEAR WAY IN

Different disciplines.
One place to begin.

Muay ThaiExplore the striking program
Jiu-jitsuExplore the grappling program
MovementExplore the movement program

Program presentation specimen. Try the original website for the filterable sample schedule and introduction preview.

Training imagery and program-discovery structure.See the website presentation ↗
  1. Find a discipline.

    Muay Thai, jiu-jitsu and movement give the visitor distinct ways to explore the concept.

  2. Read the week.

    Program filters narrow the sample schedule. The concept’s Chicago times stay in Central time.

  3. Start where you are.

    The introduction preview helps a visitor organize their interest before a conversation. No real class is reserved.

OPEN THE PROJECT FILE / 05What would a useful handover contain?

The working notes.

  • Keep program names consistent across descriptions, schedule filters and the introduction flow.
  • Maintain one source for approved class times, time zone and instructor details.
  • Agree the real booking process, availability and joining information before launch.

The review priorities.

  • Try every schedule filter and check what remains visible.
  • Keep the time zone clear beside any sample class time.
  • Use the introduction flow with a first-time visitor’s questions in mind.
View the sample project file ↗PDF · 2 pages · A self-directed portfolio example

Explore the polished website & signature experience ↗ Supporting materials ↗

BEYOND A STATIC SCREEN

Work you can
put your hands on.

Useful interaction deserves the same attention as the visual direction. These projects show the behavior as well as the presentation, using fictional data and an original playable world.

Lumen Trail painted forest clearingPlay Lumen Trail ↗
ORIGINAL WORLD / BROWSER GAME DEVELOPMENT

An atmosphere
you can move through.

A painted clearing, a traveler and a simple journey: collect four waylights and return home. Explore mode, Adventure mode, pause, restart and a guide make the study playable.

  • Keyboard & touch controls
  • Original visual direction
  • A complete small objective

THE RIGHT FIRST VERSION

What should your project
make possible?

A clearer first impression. An easier decision. A workflow your team can use. Bring the goal, the audience and the resources available, and we can shape the work around them.

Tell me about your project ↗