CNY GOLF

byBrennan Smith

"CNY Golf Shop & Range" website with a premium, modern retail feel. -------------------------------------------------- IMAGE IMPROVEMENTS -------------------------------------------------- 1. Rainbow Image (Hero): - Improve visual quality using: - Higher contrast - Slight vibrance boost - Sharpening effect - Ensure image is: - Centered on mobile - Properly cropped (focus on rainbow + range) - No stretching - Add a dark gradient overlay (top → bottom) for readability CSS example: background: linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.6)), url('hero.jpg'); -------------------------------------------------- HEADER / LOGO FIX -------------------------------------------------- - Replace the current green "CNY" text with their actual logo image - Logo should: - Be left aligned - Max-height: 50px on desktop, 40px on mobile - Keep text fallback next to logo: "CNY Golf Shop & Range" -------------------------------------------------- PRO SHOP PAGE (MAJOR REDESIGN - MAIN FOCUS) -------------------------------------------------- THIS PAGE SHOULD FEEL LIKE: → A MODERN SHOPPING WEBSITE (Nike, PGA Store, etc.) Remove: - Old banner image - Any generic sections Replace with: 1. Clean Shop Header - Title: "Shop Clubs & Gear" - Subtitle: "New, used, and trade-in options available" 2. FILTER BAR (top of section) - Buttons: - All - Drivers - Irons - Wedges - Putters - Bags - Horizontal scroll on mobile 3. PRODUCT GRID (MAIN FEATURE) - Grid layout: - Mobile: 1 column - Tablet: 2 columns - Desktop: 3–4 columns Each product card includes: - Image - Club name (ex: "Callaway Rogue Driver") - Condition label (New / Used / Trade-In) - Price (or "In Store") - Small badge (Used Deal, Featured, etc.) - Hover effect (scale + shadow) 4. PRODUCT CAROUSEL (Featured Items) - Horizontal scrolling carousel - Snap scrolling on mobile - Show: - “Featured Clubs” - “Best Deals” 5. CARD DESIGN STYLE - White background - Rounded corners (2xl) - Subtle shadow - Clean spacing - No clutter -------------------------------------------------- IMAGES FOR PRO SHOP -------------------------------------------------- - Use high-quality stock golf club images (drivers, irons, etc.) - Make sure: - Bright, clean background - Consistent style - No low-quality images -------------------------------------------------- DRIVING RANGE PAGE (KEEP SIMPLE) -------------------------------------------------- - Keep clean layout - Use real images - Add slight polish: - Cards - Icons - Better spacing -------------------------------------------------- MOBILE EXPERIENCE (TOP PRIORITY) -------------------------------------------------- - All shop cards stack vertically - Carousel scrolls naturally with finger swipe - Buttons are full width - Filter bar becomes scrollable row - Text is large and readable -------------------------------------------------- VISUAL POLISH -------------------------------------------------- - Add: - Hover scaling on cards - Smooth transitions (0.2s ease) - Consistent padding (p-4 / p-6) - Section spacing (py-12+) - Remove: - Anything that feels like a template - Overuse of borders - Cluttered sections -------------------------------------------------- GOAL -------------------------------------------------- The site should feel like: → A real golf retail store → Clean, modern, local but premium → Focused on selling clubs first The Pro Shop page should immediately stand out as the most important part of the site.

LandingProShopDrivingRange
Landing

Comments (0)

No comments yet. Be the first!

DrivingRange design preview
Landing: View Hero
ProShop: Browse Products
ProShop: Filter Category
ProShop: View Product
ProShop: View Deals
ProShop: View Featured
DrivingRange: View Range
DrivingRange: Explore Services