Renee Chen Portfolio
Bold, character-driven Webflow portfolio built around a custom cartoon mascot and a dark, maximalist hero — a distinctive brand identity most product design portfolios play far too safe to attempt.
Location
Remote-first, in the most literal sense — no idea where.
Companies
Credentials
- National Taipei University of Technology — B.A. in Interaction Design
- Potsdam University of Applied Sciences — Exchange Program, Interface Design
Skills
What makes it work
A breakdown of the choices that make this portfolio stand out.
A custom illustrated mascot as the entire brand identity
The logo and hero centerpiece is a hand-drawn orange sun-shaped character with cartoon eyes, orbited by a thin ring and small sparkle icons, set against a near-black background. Building a portfolio around one recurring illustrated character is a distinctive, memorable choice that most product design portfolios — which trend toward neutral, minimal branding — don't attempt.
Self-description as a tag cloud, not a paragraph
Below the headline "Curious Designer, Creative Thinker, Visual Storyteller," a full-width purple bar lists seven self-chosen tags — Interaction Design, Image Maker, Visual Design, Motion Graphic, Storyteller, Joyful Experience, Delight Interface — functioning like a set of hashtags rather than a written bio. It is a fast, scannable way to signal range before a visitor commits to reading a case study.
Webflow as a design statement, not just a hosting choice
Building a portfolio on Webflow rather than a template platform (Squarespace, Cargo) signals familiarity with production web design tools. The layout precision possible in Webflow — including a rounded full-bleed section transition beneath the tag bar — allows compositional choices that template themes cannot replicate.
A single, unambiguous nav destination
The primary navigation carries just one visible link — "ABOUT" — alongside the logo. Rather than splitting attention across a conventional Work/About/Contact menu, the homepage itself functions as the work-showcase, forcing every visitor through the same curated scroll sequence.
What Product Designers can take from this
Specific, actionable tips to apply to your own portfolio — no generic advice.
A custom illustrated mascot or recurring character is a legitimate way to differentiate a design portfolio in a sea of neutral, minimal templates — commit to it consistently across the whole site if you use one.
Try replacing a written personal-statement paragraph with a tag-cloud of self-chosen descriptors. It is faster to scan and works well directly under a bold headline.
If you use Webflow, push beyond the default templates — custom layouts and section transitions are what separate a Webflow portfolio from a generic one.
A single-destination navigation (just "About," everything else on one scroll) works well when the homepage itself is designed as the full showcase — don't default to a multi-page Work/About/Contact structure just because it's conventional.
Frame each case study around a decision, not a deliverable. "I chose X over Y because Z" is far more interesting than "I created wireframes, then high-fidelity mockups."
Case studies
Outcome and lessons learned come before the problem statement on Creative Board, under a header that credits the PM and fellow designer by name. Renee Chen keeps the case-study list to two Optoma projects and hands the rest of the range to a shelf of motion reels.
Optoma Creative Board: Collaboration Experience Revamp
A revamp of Creative Board, the built-in annotation and whiteboard app on Optoma's interactive flat panel displays, extended to a responsive web experience for remote and hybrid teams. The header credits Renee as Lead Product Designer alongside Winnie (Product Designer) and Ariel (Product Manager). The case study leads with Outcome and Learning & Takeaway before the Problem. It then covers competitive analysis, design principles, multi-user conflict cases, an invite-and-join session flow, and final designs such as guest join by session code, an infinite canvas, and host access-control lists.
A two-year B2B product lead with named collaborators and eight 45-minute sessions with real users (interview plus usability test). Putting outcome and learnings first shows she knows what a reviewer reads first.
Outcome and learnings placed before the problem statement
Header credits the PM and fellow designer by name
User testing stated concretely: 45-min tests × 8 with real users, plus a 1.5h stakeholder session
Design goals (simple, accessible, coherent) each tied to a user scenario and solution
Optoma Management Suite UI Redesign
A redesign of Optoma Management Suite, a display-management tool for IT administrators, after new features left it bloated and confusing. Renee worked as Product Designer, with Winnie as Lead Product Designer for OMS and Irene as PM. The case study shows before-and-after information architecture (core controls brought to the top level), wireframes, a step-by-step device-binding flow that can be resumed for unpaired devices, and a rebuilt colour and icon system with hover descriptions.
Enterprise admin tooling redesign with a clear before/after IA story. Her role is stated honestly as supporting designer, not lead, on this one.
Before/after information architecture: important controls moved to the top level
Device-binding flow designed for admins pairing many devices at once
Colour system realigned to the brand, icons given hover text for clarity
Role credited accurately: Product Designer, with the lead named
Projects
Video / Animation Reel Shelf
The homepage's Video / Animation section links eight Vimeo pieces instead of writing more case studies. They include 'BELU - A Creative Collab Platform', 'CC-ONLINE Web & App Solution', several CC-WORK pieces from her Multimedia Designer role at CC Work, a 'Digital Nomads' clip and a 'Summer Sale Poster' animation.
Product designers who can also make motion and video are useful on small teams. Linking the real reels lets a reviewer check the craft directly.
Eight Vimeo pieces linked from the homepage, from 2019 to 2024 uploads
Product explainers (BELU, CC-ONLINE) alongside promotional animation
Backs up the About page's After Effects / Premiere skills with real output
More Product Designer portfolios
Ready to build your portfolio?
Follow the Product Designer roadmap — skills, projects, and timeline to get hired.