SERÁWeb studio
SaaS · Brand identity & product UI

ShotMatch UGC

Create with direction. Manage with clarity.

A founder-led AI workspace concept for UGC creators and brand campaigns.

Role
Founder & designer
Year
2026
Format
15 slides
01Project Context

A creator-first workspace with a recognizable frame.

Read this slide as text

Product vision Design challenge

ShotMatch UGC is the founder's SaaS project for creators and brands. The Creators move between briefs, messages, scripts, deliverables and

stated scope includes portfolio development, campaign organization, campaign stages. The proposed design brings those activities into a clear

AI-assisted content and workflow support. visual hierarchy.

Existing identity What is new here

Earlier founder-owned concept visuals establish emerald, deep green, light Three moodboards with dedicated pages, explicit palette roles, six icon

neutral surfaces and a four-corner viewfinder symbol. This study develops treatments and a refreshed desktop/mobile workspace concept. New

that existing direction. screens are not live product screenshots.

The live website could not be retrieved during preparation. Product features are based on founder-provided scope and historical concept assets, not a verified

feature audit.

02Brand Strategy

From creative possibility to an organized workflow.

Read this slide as text

Proposed audience Positioning hypothesis

Independent UGC creators and small creative teams managing content and An AI-assisted workspace that connects creative preparation with

client opportunities. Brand collaborators form a related audience; their campaign organization. Lead with practical tasks: understand a brief,

workflows need separate validation. draft content, track next steps and present a portfolio.

Personality Brand promise

Encouraging, capable, direct and creative. Use warm photography and calm Help creators organize their work and move a campaign forward. Avoid

instructions, balanced by structured workspace controls. guaranteeing earnings, campaign success, fair compensation, legal

protection or scam detection accuracy.

Audience and positioning are design hypotheses. This study contains no new user interviews, market-size research or measured customer outcomes.

03Existing Visual Foundation

Emerald identity. Human creative context.

Read this slide as text

Historical founder-owned concept assets informed this design extension.

Retain: four-corner framing symbol, deep green wordmark, emerald highlights and creator

imagery.

Refine: reduce feature density, make the next action clearer, and treat AI outputs as drafts

or review prompts rather than guaranteed judgments.

Historical messaging and sample results are not validated

product claims.

04Moodboard Overview

Three directions within one creator brand.

Read this slide as text

AI-generated concept imagery; depicted people and scenarios are illustrative, not customer endorsements.

05Dedicated Moodboard

Creator Daylight

Read this slide as text

Human / welcoming / practical

Visual language

Warm daylight, home studios, linen, matte surfaces and recognizable

filming tools.

Why this direction

Connect the software with everyday creative work. Human context

adds warmth without making the workspace visually noisy.

Recommended use

Homepage, onboarding, creator education and portfolio storytelling.

#073B35 #00A86B #E6F7EF #FAF8F3

06Dedicated Moodboard

Emerald Studio

Read this slide as text

Focused / polished / dimensional

Visual language

Deep green backgrounds, tabletop production sets, frosted acrylic and

precise framing motifs.

Why this direction

A more cinematic expression supports launch imagery while retaining

the recognizable emerald identity.

Recommended use

Campaign launches, feature introductions, sales presentations and

brand collaboration pages.

#062D28 #007F5F #32D69A #EAF5EF

07Dedicated Moodboard

Campaign Edit

Read this slide as text

Editorial / sequential / organized

Visual language

Contact sheets, storyboards, timeline-inspired graphics and generous

white margins.

Why this direction

Show the relationship between brief, script, production and deliverable.

A sequence makes the creative process tangible.

Recommended use

Script Studio concepts, campaign planning, tutorials and editorial social

content.

#103C34 #16A875 #D7ECE1 #F4F2EC

08Palette Selection

Creator Daylight leads the everyday system.

Read this slide as text

FOREST INK EMERALD PALE MINT WARM IVORY

#073B35 #00A86B #E6F7EF #FAF8F3

Primary headings and strong dark Brand highlights and selected action Supportive cards and selected Main canvas and editorial breathing

surfaces treatments backgrounds room

System roles Accessibility work

Use ivory and mint for most UI surfaces. Forest Ink supports readable Test every actual pairing. White text on a bright emerald button may

content. Emerald adds recognition and a clear focal point. Keep gradients need a darker fill. Status labels, focus indicators and errors must work

for limited campaign moments. without color alone.

09Logo Architecture

A frame that connects capture, focus and content.

Read this slide as text

Existing symbol

Four separated rounded corners suggest a camera viewfinder. The open

center supports the idea of focusing on a creator's work. This is a design

interpretation, not proof of exclusivity.

Six variants

Primary, Dark, Emerald, Mint, Mono and Gradient preserve the underlying

geometry. Use a simplified flat treatment for routine UI and reserve

gradients for expressive settings.

Production master

Image-generated variants differ slightly. Rebuild one vector master,

correct spacing and corner consistency, define clear space, and test

actual small-size exports.

10Type & Composition

Confident headlines. Calm working surfaces.

Read this slide as text

Your next Type hierarchy

Display: 36-56 px / bold

Section: 24-32 px / semibold

campaign starts here. Body: 15-17 px / regular

UI labels: 12-14 px / medium

Technical details: readable values and units

Proposed typography

A contemporary geometric sans for headlines and a readable UI sans for Composition

dense content. Candidate direction: Manrope for display and Inter for body,

subject to licensing and final testing. This PDF uses embedded DejaVu. Use aligned cards, predictable spacing and an obvious primary task. Keep

photographic depth in campaign areas; use simpler surfaces around

tables, forms and editing controls.

11Digital Identity

Desktop organization. Mobile momentum.

Read this slide as text

Concept workspace and icon explorations. All profiles, projects and generated content are illustrative.

12Experience Design

Three tasks that give the workspace a clear purpose.

Read this slide as text

01 / Track an opportunity 02 / Create a script draft 03 / Ask the AI Mentor

Pipeline cards show a project, current stage and Product, audience and tone provide useful Start with specific prompts such as outlining a

next action. New, In discussion and Booked context. The AI output remains editable, with script or reviewing a brief. Make the scope of

become meaningful states; avoid unexplained options to regenerate, copy, save and review assistance clear and show when information is

scores and vague readiness badges. before use. uncertain or incomplete.

Proposed flow States to design

Home > select task > add project context > review draft or stage > edit > Empty pipeline; first project; generating draft; missing input; failed

save. Each step should make the current project and next action clear. generation; unsaved edits; completed action. Test keyboard navigation

and mobile touch targets.

Validation: observe people adding an opportunity, finding a deadline and editing an AI draft. Document actual results before claiming the new UI is easier or faster.

13Differentiation & Voice

Creative warmth with practical structure.

Read this slide as text

Visual rationale Proposed distinction

Emerald, ivory and forest green support a coherent system across product Combine a human creative context with a practical workspace: campaign

and creator imagery. The framing mark connects the identity with content stages, content drafts and portfolio organization. Test whether this

production. These choices do not establish market uniqueness. combination addresses real unmet needs.

Voice principles Example language

Encouraging without pressure. Specific rather than exaggerated. Treat AI as Your next campaign starts here.

assistance, preserve creator judgment, and make suggested actions Bring your brief into focus.

understandable. Draft it. Refine it. Make it yours.

Keep your creative work moving.

Any future pay analysis, contract review or scam-risk feature needs transparent limits and supporting evidence. A polished brand should not imply guaranteed

earnings or legal protection.

14Delivery & Credits

From concept presentation to an editable system.

Read this slide as text

Proposed deliverables Next phase

Vector logo master; light and dark lockups; icon exports; color and text Resolve the identity master. Build reusable components with Auto Layout.

styles; presentation templates; social campaign layouts; Figma Prototype core flows. Test readability and usability. Verify current feature

components; responsive screens and a connected prototype. behavior before publishing product claims.

Project credits Source notes

ShotMatch Hero Mockup; ShotMatch UGC creator protection page. These

Direction developed through founder-owned references and iterative are concept images, not evidence of supported functionality or customer

AI-assisted visual exploration. No new usability study, clinical research or results.

conversion result is reported.

Website: https://shotmatchugc.com / The site could not be retrieved during preparation. This document is a proposed brand and UI case study rather than a

verified live-site review.