A full homepage and landing page redesign for Hookstory, a storytelling and entertainment brand. The project covered a complete Elementor global style overhaul, new header and footer templates, a full homepage restructure and redesign, hero image swap, font standardization to Montserrat, and full responsiveness — delivered across two focused sessions.
Hookstory — Website Redesign & Landing Page Development
Overview
Hookstory is a storytelling and entertainment brand with an existing WordPress website that needed a fresh, brand-aligned redesign. The project involved a complete overhaul of the site's visual foundation — updating global styles, rebuilding the header and footer, fully restructuring and redesigning the homepage and landing page, and ensuring everything was responsive and consistent with the updated brand identity.
The Challenge
The site's design had drifted from the brand — fonts had been swapped away from the preferred Montserrat typeface, the global color and typography system was misaligned with the current logo, and the homepage sections lacked the visual structure and polish needed to represent the brand effectively. Key challenges included:
- Re-establishing a brand-consistent global design system in Elementor from the ground up
- Rebuilding the header and footer templates to match the updated brand direction
- Fully restructuring and redesigning all homepage and landing page sections
- Standardizing typography to Montserrat globally — including overriding sections where global font settings hadn't been applied
- Swapping the hero section background image with the client's new asset
- Ensuring full responsiveness across all redesigned sections and devices
Development Process
Environment Preparation
A full site backup was created before any development work began. All WordPress plugins were updated to their latest versions. The media library was cleaned up — unused fonts and images were removed and optimized image assets were re-uploaded to ensure a clean working environment.
Global Style System
Brand-aligned colors and fonts were selected to match the current logo. Elementor's global site settings were updated across layout, typography, color system, and global styles — establishing a consistent design foundation for all pages.
Header & Footer
New header and footer templates were designed and implemented from scratch, aligned with the updated brand identity and built for full responsiveness.
Homepage & Landing Page Redesign
All homepage sections were completely restructured and redesigned. The work continued into a second session to complete the remaining landing page sections. The hero section background image was replaced with the client's new header image asset. Every section was reviewed and finalized for full responsiveness across all device sizes.
Typography Standardization
Global fonts were changed to Montserrat across the entire site. Sections where the global font setting had been overridden individually were also updated manually to ensure complete typographic consistency throughout.
Key Features
- Full Global Style Overhaul — Colors, typography, layout, and button styles rebuilt in Elementor to match the current brand
- New Header & Footer Templates — Designed and implemented from scratch with full responsiveness
- Complete Homepage & Landing Page Redesign — All sections restructured and redesigned with a fresh visual direction
- Hero Image Swap — New client-provided header image applied to the hero section
- Montserrat Typography — Applied globally and individually across all sections for full consistency
- Media Library Cleanup — Unused assets removed and optimized images re-uploaded
- Full Responsiveness — All redesigned sections tested and verified across devices
Result
A fully redesigned, brand-consistent Hookstory website — with a rebuilt global design system, new header and footer, a completely restructured homepage and landing page, standardized Montserrat typography throughout, and full mobile responsiveness, delivered across two development sessions.