When Trojan Monkeysâa creative agency specializing in buzzworthy contentâneeded a website that matched their bold personality, they came to me with one request: "Make it unforgettable." Challenge accepted.
1. Hero Section: "Where Monkeys & Motion Collide"
The Hook:
Loader with Personality: A playful intro with the brandâs orange logo bouncing into view, teasing the adventure ahead.
Sparkyâs Grand Entrance: A 100% viewport hero with a parallax-effect chimp (Sparky) that sticks around as you scrollâliterally!
Tagline Magic: Bold copy declaring, âContent that captivates? Weâre bananas for it.â
2. The Triangle Tango: "Three Steps to Marketing Magic"
The Brainchild:
Interactive React Triangle: A dynamic, animated triangle representing their Trojan Plan (Strategy, Creativity, Impact). Hover to see corners light up!
Two Designs, One Winner: Originally fought for space with Sparky, but the final full-triangle version won hearts (and pixels).
Why It Roars: No static infographics hereâthis shape moves and teaches without a single bullet point.
3. Client Carousel: "A Whoâs Who of Who Weâve Wowed"
The Roll Call:
Hover-Slowing Gallery: Client logos glide in a smooth carousel that slows down when you hoverâlike digital window shopping.
Secret Sauce: Logos pulled from the wild web? Nopeâcrisp, custom-optimized files to avoid pixelated shame.
4. Project Cards: "Where Hover Meets Houdini"
The Showstoppers:
Sticky Scroll Sorcery: Cards stack like pancakes as you scroll, each with project-specific hover effects (e.g., TUI cards âflyâ sideways).
CMS Power: All content pulled from a foolproof systemâclients can swap videos/images without breaking a sweat.
âView Allâ CTA: Ends with a cheeky button: âStill scrolling? Thereâs moreâŚâ
5. "AIâs the Sidekick, Humans Wear the Cape"
The Philosophy Section:
Bold & Animated: Orange background pops, Sparky grows/shrinks as you scroll, and copy shouts: âWe train bots, bots donât train us.â
CTA with Bite: A button urging users to âMeet the Humans Behind the Magicââbecause robots canât drink coffee.
6. Our Business Playground: "Where Ideas Swing Wild"
The Nitty-Gritty:
Cursor-Chasing Images: Hover over services like âPartnershipsâ to see Sparkyâs plushie + merch photos slide in on the left.
Mobile-Friendly Grid: Desktop = interactive playground; mobile = clean grid (no tiny cursor tantrums).
7. Meet the Monkey Crew: "Bios That Flip (Literally)"
The Team Section:
Horizontal Scroll â Grid Glow-Up: Cards now in a tidy grid (future-proof for 50+ monkeys).
Bio Magic: Hover to see cards dodge your cursor; click to flip and reveal team secrets (plus a âPssst⌠weâre hiring!â Easter egg).
8. Case Studies That Stack Like Pancakes
The Project Pages:
Immersive Scrolling: Sections stack on top of each otherâimage left, copy right, then flip-flopped.
iPhone Mockups: Videos play in custom iOS-style frames with tap-to-fullscreen and mute buttons. Users control the show!
9. Contact Us: "Your Ticket to the Banana Phone"
The Footer Finale:
Sparkyâs Mood Board: Footer images change based on your page (e.g., Projects = Sparky in explorer gear).
Social Links + Phone: Added a phone number with a banana-shaped iconâbecause why not?
10. 404: "Oops, Someone Ate the Banana"
The Error Page:
Playful Design: A lost Sparky in a jungle maze, waving a âGo Back!â sign.
Hidden Game: Press arrow keys to ânavigateâ him out (spoiler: you canâtâbut itâs fun to try).
Why This Redesign Climbed to the Top
Engagement Overload: Hovers, flips, scrollsâusers play instead of just browsing.
Future-Proof AF: CMS-ready, scalable grids, and color/text systems for easy rebrands.