Wallex / Project period [verify]Senior Product Visual Designer

WG—01

Making digital goldfeel tangible.

A scalable product visual system built to translate trust, clarity and premium simplicity into an online gold-trading experience.

V—01

Primary case-study cover

Final Wallgold hero visual

Use the strongest 3D object in its real landing-page composition. Preserve generous negative space around the headline.

V—0116:102400 × 1500 PXWEBP + MP4
RoleVisual direction, 3D & motion
ScopeProduct, landing & campaigns
ToolsBlender, Figma, Adobe CC
CompanyWallex

The short version

Gold is physical, familiar and emotionally tied to security. Wallgold had to preserve those qualities inside a fast digital product—without falling into the visual clichés of the gold category.

My mandate

Define the visual language, create its flagship 3D expression, and make it repeatable across product and launch touchpoints.

01 / Context

Giving a physical asset a digital presence.

Wallgold gives users access to gold through the Wallex ecosystem. The experience needed to carry the credibility of a financial product and the tangible value of a physical one.

The opportunity was not to make the interface look more luxurious. It was to make value feel understandable, protected and close at hand—while remaining coherent with the wider Wallex product.

V—02

Product context

Wallgold inside the Wallex ecosystem

Show one key Wallgold screen beside a simple ecosystem map. Keep the diagram factual and label only the relationships needed for this story.

V—023:21800 × 1200 PXWEBP

02 / Challenge

Credible and desirable—without the theatre.

How might we make digital gold feel credible and tangible without relying on the excess commonly used by gold brands?
01Physical valueDigital experience
02PremiumAccessible
03Emotional appealFinancial clarity
04DistinctiveWallex-consistent
V—03A

Audit evidence

Category conventions

An annotated competitor board: recurring palettes, symbols, render styles and trust signals.

V—03A4:31600 × 1200 PXWEBP
V—03B

Design opportunity

Use / avoid matrix

Contrast the visual behaviors kept for credibility with the luxury clichés deliberately rejected.

V—03B4:31600 × 1200 PXWEBP

03 / Strategy

Confidence through clarity. Value through materiality.

01

Trust before spectacle

Every visual should support understanding before it asks for attention.

02

Tangible, not decorative

Material realism connects a digital action to the physical value behind it.

03

Premium without excess

Control, space and precise light replace predictable luxury clichés.

04

Modular by default

The system must survive product screens, campaigns, motion and mobile crops.

V—04

Strategy proof

One visual example per principle

Use four tightly cropped frames. Each annotation should explain a decision—never merely describe what is visible.

V—0421:92400 × 1030 PXWEBP

04 / Exploration

Three routes. One clear choice.

The exploration was narrowed to distinct strategic routes—not a gallery of disconnected style tests.

A

Direction 01

Digital vault

Security-led and structured. Rejected: felt too institutional for an accessible product.

A1:11400 × 1400 PXWEBP
B

Direction 02

Liquid value

Fluid and expressive. Rejected: visually distinctive, but weakened perceived stability.

B1:11400 × 1400 PXWEBP
C

Selected direction

Tangible simplicity

Materially credible, calm and adaptable. Selected for its balance of trust and accessibility.

C1:11400 × 1400 PXWEBP

05 / Visual system

A hero asset is not a system.

The real work was turning one visual direction into repeatable rules for material, light, composition, iconography and motion.

Colour / controlled warmth

#D7AD51#F0CA72#171714#F0EEE7

Replace these draft values with the approved product tokens. Document contrast, proportion and where gold must not be used.

V—05

Material study

Gold shader + edge treatment

Show close crops of roughness, reflection and bevel behavior under the approved light rig.

V—054:31600 × 1200 PXWEBP

Camera & composition

  • Angle[Approved camera angle]
  • CropProtect text-safe space
  • ShadowSoft / grounded / minimal

Motion language

Quiet confidence, never restless luxury.

01 Controlled entry02 Subtle rotation03 Seamless loop04 Reduced-motion fallback

Flagship 3D hero

From geometry to product-ready asset.

V—06A

Process / 01

Viewport + blockout

Show the early camera and geometry. Annotate what was decided here—not every Blender setting.

V—06A4:31600 × 1200 PXWEBP
V—06B

Process / 02

Light + material tests

Compare two or three meaningful variants and state why the final setup won.

V—06B4:31600 × 1200 PXWEBP
V—06C

Process / 03

Compositing passes

Break the final frame into base render, highlights, atmosphere and interface integration.

V—06C4:31600 × 1200 PXWEBP
V—07

Final hero / decisive visual

Desktop-to-mobile responsive composition

Present the final visual in context, then show how object scale, crop and negative space adapt across breakpoints.

V—0721:92560 × 1097 PXWEBP + MP4

06 / Application

One language. Every meaningful moment.

Show the system working inside the real product before using decorative device mockups.

V—08

Primary product application

Real Wallgold landing-page implementation

Use a full-page capture or a clean sequence of real sections. Highlight hierarchy, text-safe areas and responsive decisions.

V—0816:102400 × 1500 PXWEBP
V—09A

Product state

Onboarding / purchase moment

One real screen with a short note about what the visual helps the user understand.

V—09A9:161080 × 1920 PXWEBP
V—09B

Product state

Success / confirmation

Show how the system reinforces certainty after a high-trust action.

V—09B9:161080 × 1920 PXWEBP

For every screen, explain

  1. 01What user moment is this?
  2. 02What information had priority?
  3. 03What visual decision supported it?
  4. 04What changed on mobile?
  5. 05What technical constraint mattered?

System extension / asset family

V—10AIconography1:1 / 1200 PX
V—10BIllustration1:1 / 1200 PX
V—10CCampaign1:1 / 1200 PX
V—10DMotion1:1 / 1200 PX

07 / Workflow

Designed to survive implementation.

01Product brief
02Visual exploration
033D + motion system
04Responsive variants
05Engineering handoff
06Visual QA
V—11A

Production system

File architecture + reusable components

Show naming, component logic and export presets—not confidential messages or internal URLs.

V—11A3:21800 × 1200 PXWEBP
V—11B

Implementation proof

Design vs. production QA

A precise comparison with two or three corrections that protected the intended visual quality.

V—11B3:21800 × 1200 PXWEBP

08 / Outcomes

Show contribution. Never fake causation.

[XX]

Primary verified launch metric

Add definition + timeframe + source
[XX%]

Verified product or funnel outcome

Add baseline + measurement period

The reusable system gave product and launch teams a coherent visual library across key touchpoints, reducing the need to redefine the direction for every new application.

Qualitative design contribution
Evidence rule

Publish only figures you can define and source. If no A/B test isolated visual design, claim contribution—not sole causation.

Reflection

Premium communication depends more on control than decoration.

Material realism made the value feel tangible. Consistency across product states, responsive layouts and implementation is what turned that direction into a usable system.

Next iteration

Validate the principles through perception testing and strengthen documentation for motion and responsive behavior.

V—12

Closing image

Final full-bleed Wallgold product visual

End with conviction: one clean, high-resolution image with no annotations or process clutter.

V—1221:92560 × 1097 PXWEBP + MP4