Skip to main content

B2B Brand Customization

Frontend Developer · 2022 · 1 min read

Improved the brand customization experience for businesses, giving them more autonomy and better tools to organize their profile pages, including image editing and video integration.

Overview

I contributed to a high-traffic consumer platform, evolving the brand customization experience to give company administrators more autonomy and better tools for identity management.

Problem

Existing customization was limited, preventing companies with great service from standing out. We needed a self-service system simple enough for non-technical users.

Constraints

  • The page is public-facing and high-traffic, so any change had to be performant
  • Had to work within an existing monolithic frontend codebase
  • UX needed to be simple enough for non-technical company admins to use

Approach

Refactored the profile editor to include custom cover cropping, Unsplash integration, and video support. Migrated from prop-drilling to Context API for better state management.

Key Decisions

Context API for data flow

Reasoning:

Prop-drilling became unmanageable. Context API provided a clean way to organize editor state at the time.

Unsplash API & Cropping Tool

Reasoning:

To offer a premium image library and ensure pixel-perfect cover alignment.

Styled Components from Figma

Reasoning:

Ensured visual fidelity by translating Figma (DevMode) specifications directly into CSS-in-JS.

Tech Stack

  • React
  • TypeScript
  • Context API
  • Styled Components
  • Unsplash API
  • Figma

Result & Impact

Increased business autonomy and better brand differentiation for millions of platform users.

Learnings

  • This project solidified my foundations in React, specifically in handling complex states and modern CSS-in-JS.