Online Auction Redesign
Transform an existing online auction website into a fully interactive, scalable, and user-centered platform supporting real-time bidding, transparent pricing, and seamless user participation.
Quick Information
Role
Lead UX Designer
Process
Discovery & research
Ideation
Design
Testing
Final Takeaway
Tools
Xd
Mira
Slack
Zoom
MS Office

Goal
Rearchitect the existing online auction platform into a fully interactive, scalable solution that supports real-time bid processing, dynamic pricing transparency, and frictionless end-to-end user interaction through a modern design framework.
Problem
Users of the current online auction platform face significant usability and performance challenges that hinder effective participation. Common issues include lack of real-time feedback on bidding status, unclear pricing updates, and a non-intuitive interface that makes it difficult for new users to navigate auctions or track item status. These limitations reduce user confidence, lower engagement, and ultimately impact the success of auctions and platform trustworthiness.
Solution
Real-time feedback system to ensure users receive immediate confirmation of bid status, streamline the UI architecture with simplified layout, mobile responsive and accessible design, and provide contextual guidance and tooltips that explain features.
Discovery & Research
Objectives:
-
Understand key pain points in the current website from customers
-
Explore user behaviors around online bidding
-
Investigate issues with bidding and potentially preventing bids from being placed because of lack of user knowledge
Activities:
-
Stakeholder interviews with project managers and auction managers
-
Attend live auctions to get aquatinted with production and equipment
-
Heuristic evaluation of the current website
-
Task analysis on current auction flow.
-
Competitor audit (eBay, HiBid, LiveAuctioneers)
Key Insights:
-
Users found the bidding experience confusing and unsure of .
-
Lack of real-time feedback was lacking for competitive bidding.
-
Mobile experience was nonexistent because of the responsiveness of current site.
-
On-site auction managers were unaware of how our site impacted the bidding experience.


Define, Sketch, & Ideate
Feature Prioritization:
-
Must: Real-time bid updates, live countdown, outbid/win notifications, calendar, admin controls, filter by category
-
Should: auction host dashboard, mobile-friendly design, payment confirmation
-
Could: Watchlist, user calendar,
-
Won’t: Third-party integrations
Activities:
-
Low-fidelity wireframes in Xd.
-
User flow diagrams for:
-
Browsing lots → Watching → Bidding → Winning/Losing → Checkout
-
-
Host flow from auction setup → live monitoring → results
-
Whiteboard sessions with devs to align on real-time updates.
Design Goals:
-
Emphasize immediacy: countdown timers, status banners, active feedback.
-
Minimize friction: easy registration, guided bidding, intuitive navigation.
-
Prioritize clarity: mobile-first responsive layouts and clear CTAs.
Wireframe & Prototype
Outputs:
-
Mid-fidelity prototypes built and reviewed with real users via moderated Zoom calls.
-
Created simple interactive website for:
-
Bid placement and confirmation flow
-
Real-time update perception
-
Outbid response timing
-
Host's live dashboard usability
-
Key Feedback:
-
Users liked instant feedback but needed clearer “Outbid” and “Win” states.
-
Countdown timers were effective but needed better mobile legibility.
-
First-time users still needed more onboarding context before their first bid.
Iteration:
-
Added microinteractions and sound cues for real-time changes.
-
Streamlined onboarding with tooltips and other needed information.
-
Optimized countdown visual hierarchy for mobile users.


Design System & Dev Handoff
Deliverables:
-
Full responsive component library (Cards, Timers, Buttons, Auction Modals)
-
Defined real-time states for:
-
“Bid Placed,” “Outbid,” “Leading,” “Won,” “Closed”
-
-
Design spec annotations for:
-
Event triggers
-
Loading/failure states
-
-
Mobile-specific adjustments (touch target sizing, scroll behavior)
-
Created a mobile specific bid screen to reduce bidding errors
-
Collaboration:
-
Daily stand-ups, weekly Xd review check-ins.
-
Created documentation for UI states and transitions.
-
Supported devs with desktop and mobile iterations on an as needed basis.
Final Features
Outputs:
-
Real-time auction interface with buffered updates
-
Live status indicators and countdown timers
-
Responsive design for mobile and desktop
-
Bid confirmation modal with fallback handling
-
Host dashboard for auction activity and admin control
-
Post-auction summary and win notification email templates
Early Feedback:
-
Bid completion rate improved from original version
-
Time-on-site increased due to engaging real-time elements
-
User satisfaction scores rose, because users were able to use mobile
-
Auctioneers cited more control and user feedback during live events
Next Steps:
-
Implement watchlist and saved auctions for return users
-
Add scheduled auction calendar with filters and alerts
-
Explore proxy bidding and instant checkout flows
-
Prepare for future integrations with 3rd party software and auction house CRMs
