Overview
A full end-to-end website redesign for Timothy Grant Jewelry — a family-owned boutique jeweler with two Illinois locations specializing in award-winning custom jewelry, fine jewelry, and expert services. I led competitive research, persona development, IA restructuring, visual identity creation, and high-fidelity design across a 6-page responsive web system.
Role
Lead UX Designer: led competitive research, persona development, information architecture, visual identity, and high-fidelity design across a 6-page responsive web system.
Team
Leigh Arriane Buendia, Pamela Olalia, Dani Guerrero
Platform
Responsive web (desktop-first, mobile-optimized)
The Problem
The existing Timothy Grant website felt dated and minimal. The homepage showed a single product image on a white background — no value proposition, no calls to action, and no indication of the full range of services the business offered.
Old Timothy Grant website homepage
Old website navigation
01No brand presenceThe old logo was a casual script mark that didn't convey luxury or trust. The site had no consistent color palette, typography, or visual language.
02Poor information architectureThe Fine Jewelry page was organized by brand name (Royal, Stuller, Triton, Venetti) rather than by product category — a structure that served the business's inventory logic but not the customer's shopping behavior.
03Buried servicesOfferings like custom design, repairs, acquisitions, and appraisals were listed as text-heavy pages with no visual hierarchy or clear CTAs. The custom jewelry process was reduced to a small numbered list, making an already intimidating experience even harder to approach.
04No conversion pathwaysNo booking system, no appointment scheduling, and no prominent contact mechanism beyond phone numbers in the sidebar. The only interactive element was an empty shopping cart.
05Competitive disadvantageLocal competitors like Studio D Jewelers and Rahl Jewelers had more visually polished websites with clearer service presentation, better mobile responsiveness, and stronger engagement features.
The business needed a refreshed, user-focused website that would establish credibility, surface its full value proposition, and convert browsers into consultation bookings and store visits.
Research & Discovery
I conducted structured research across three areas: a competitive audit of local jewelers, persona development based on business goals, and information architecture restructuring to align the site with user behavior.
Competitive Analysis
I audited two direct local competitors — Studio D Jewelers and Rahl Jewelers — across six dimensions: visual design and branding, navigation and IA, content and messaging, service presentation, technical performance, and engagement and conversion.
01Studio D JewelersMore modern visual identity and strong storytelling, but navigation was overwhelming — a dense multi-level accordion menu confused the hierarchy. CTAs were inconsistent, no above-fold CTA on the homepage, and certifications or social proof were absent.
02Rahl JewelersStrong craftsmanship content and transparent service listings, but visual design felt dated. Photography was inconsistent, typography mixed serif and sans-serif without purpose, and booking features were buried deep inside product pages.
Studio D Jewelers competitive audit
Rahl Jewelers competitive audit
Key competitive opportunities
—Neither competitor combined strong visual branding with intuitive navigation and clear conversion pathways.
—Neither had an integrated online booking system — both relied on phone calls.
—Opportunity to differentiate through a transparent, step-by-step custom design process that builds trust before the first visit.
—Social proof, certifications, and team credentials were underutilized across the competitive landscape.
User Personas
I developed three personas representing Timothy Grant's core customer segments. Each maps directly to a primary page and user flow in the redesigned site.
Persona: Custom Jewelry Jane
Persona: Luxury Buyer David
Persona: Repair & Resell Linda
"Custom Jewelry Jane", 30Marketing Manager, Chicago. Planning her engagement and wants a one-of-a-kind ring. Needs a visual process walkthrough, a gallery of past custom work, and easy consultation scheduling. Afraid of hidden costs. Maps to the Custom Jewelry page.
"Luxury Buyer David", 47Corporate Lawyer, Lake Zurich. Buys luxury gifts with limited time. Needs clear category browsing, pricing transparency, and a fast contact path to reserve items. Maps to the Fine Jewelry shop.
"Repair & Resell Linda", 64Retired Teacher, Schaumburg. Needs repairs, resizing, or wants to sell old pieces. Searches desktop for local jewelers and reads reviews before choosing. Needs jeweler credentials and clear booking instructions. Maps to the Services page.
Information Architecture
Using insights from the competitive audit and persona scenarios, I restructured the site's navigation from a 5-page flat layout to a more intentional 6-page hierarchy, with a new Wishlist feature ensuring every persona had a clear entry point from the homepage.
Before: 5-page flat navWelcome, Custom Jewelry, Fine Jewelry, Services, Hours & Locations — organized around the business's internal structure, not customer behavior.
After: 6-page intentional hierarchy + WishlistHome, Custom Jewelry, Fine Jewelry, Services, Contact, My Likes — each page maps directly to a persona's primary goal, with cross-sell paths between them.
Home
Featured Collection Carousel
Information architecture diagram
Ideation & Design System
Before diving into page layouts, I developed a cohesive visual identity system — colors, typography, logo, and components — to ensure consistency across all pages and give the team a shared foundation for high-fidelity design.
Visual Identity
The original branding used a casual handwritten script on a white background with no supporting visual system. The redesigned identity communicates luxury, warmth, and approachability — premium without feeling cold or exclusive. The warm, earthy palette is a deliberate departure from the black-and-white or navy-and-gold palettes common in luxury jewelry, evoking the warmth of gold and handcraftsmanship central to Timothy Grant's brand story.
TypefaceCormorant Garamond
Display48px · Bold
Award-Winning Custom JewelryHeading32px · Semibold
Book Your Free ConsultationSubheading24px · Medium
Crafted with PurposeTypefaceFigtree
Subheading18px · Semibold
Fine Jewelry & Custom DesignsBody16px · Regular
Fine jewelry from curated brands, handcrafted with care.Label14px · Medium
Rings · Necklaces · Earrings · BraceletsPrimary wordmark logo
Stacked logo
TG monogram submark
Component Library
Components were built and documented in Figma before page design began, ensuring consistent patterns across the full site.
—Product cards with hover states and wishlist heart icons
—Navigation bar with active state styling
—Announcement marquee bar
—CTA button styles (filled and outlined)
—Category filter pills
—Price range slider
—Booking calendar components
—Comprehensive footer with multi-column layout
Component library in Figma
Final Design
The redesign spans 6 pages plus a wishlist feature, each built around a specific persona's journey. Every page was designed desktop-first with mobile-optimized counterparts.
Timothy Grant final design overview
Homepage
Rebuilt from a single-product placeholder into a full storytelling experience. A full-bleed hero image with a scroll-down prompt sets the tone, followed by a 'Featured Items' carousel with category tabs, editorial-style entry points to Custom and Fine Jewelry, a services snapshot, and a boutique visit section with hours and directions.
Homepage hero section
Homepage featured items carousel
Custom Jewelry Page
Designed to address Custom Jewelry Jane's core need: understanding the process before committing. The hero leads with "Award-Winning Custom Jewelry by Timothy Grant" and a "Book Your Free Consultation" CTA. The 4-step process is a visual walkthrough with photography and copy, followed by a secondary CTA and a filterable gallery of past custom work.
01CollaborateShare your vision, inspiration, and budget in a free consultation — in-store or remotely.
02VisualizeOur designers produce detailed sketches and 3D CAD renderings for your approval.
03RefineReview a physical wax model or prototype before final production begins.
04CraftYour piece is handcrafted to the approved design and delivered with certification.
Custom jewelry page hero
4-step custom process
Fine Jewelry Shop
Completely restructured from brand-organized to user-organized. A left-sidebar filter panel lets users browse by jewelry type, adjust a price range slider ($1,200–$5,000), and sort results. Products display in a clean 4-column grid with consistent photography, item names, prices, and wishlist hearts — directly serving Luxury Buyer David's need to quickly find, compare, and save.
Before: organized by wholesale brand (Royal, Stuller, Triton, Venetti)Reflected the business's inventory logic. Customers searching for 'rings' had no way to filter by product type.
After: organized by product category with price filtering and sortAligns with how customers actually shop — by jewelry type and budget, not by the name of a wholesale supplier they've never heard of.
Fine jewelry shop page with sidebar filters
Services Page
Transforms three text-heavy sections into a visually structured experience. Each service leads with credentials and specific offerings, and every section ends with a clear CTA.
RepairsLed with 35+ years of combined jeweler experience. Enumerates specific services — ring sizing, stone replacement, prongs and clasps, soldering, watch batteries — with custom icons and a 'Call to Book' CTA.
AcquisitionsTwo-column layout pairing an image with persuasive copy about selling or redesigning old pieces, with a clear CTA to visit or contact the store.
AppraisalsHighlights Graduate Gemologist Heidi's credentials and lists what each appraisal includes, building trust through expertise and transparency.
Contact & Booking Page
Where all three personas converge. A two-column layout: the left column provides quick-reference info (email, hours, both locations with phone and directions), while the right column houses the full booking flow — calendar date picker, time slot selection, location and appointment type dropdowns, and a contact form. This replaces the old phone-only system with 24/7 self-service lead capture.
My Likes (Wishlist)
A new feature that didn't exist on the original site. Users can heart products across the shop and custom jewelry pages, then view all saved items in a dedicated grid. Serves David's 'browse and shortlist' behavior and Jane's inspiration-gathering phase, while giving the business insight into which products generate the most interest.
Results & Impact
This project is currently in progress and has not yet launched, so quantitative performance data is not yet available. The redesign was built to address specific, measurable outcomes based on the competitive gaps and user needs identified during research.
Projected impact across five key dimensions:
Increased consultation bookingsThe integrated booking calendar replaces a phone-only system, removing a major friction point for all three user segments — particularly younger demographics like Jane who prefer self-service scheduling.
Improved service discoverabilityRestructuring the homepage to surface custom jewelry, fine jewelry, and services as distinct entry points should increase engagement with secondary pages like Repairs and Appraisals.
Stronger competitive positioningThe redesign addresses every weakness identified in Studio D and Rahl's online presence — consistent branding, intuitive navigation, transparent process communication — plus introduces features (wishlist, booking calendar) neither competitor offers.
Higher product engagementCategory-based browsing with filtering replaces brand-organized listings, aligning the shopping experience with how customers actually search — by product type and price, not wholesale brand.
Brand credibility upliftA cohesive visual identity system replaces an inconsistent, outdated presentation, positioning Timothy Grant's digital presence to match the quality of their in-store experience.