Case Study:
elektrik eel
Role:
web design
Timeframe:
12 weeks
Tools:
Illustrator, Figma, HTML, CSS, JavaScript
the brief
Design and develop a website for Elektrik Eel that reflects the festival's brand identity, appeals to its target audience, and creates a memorable digital experience that differentiates the event from competing festivals.
research foundation
The project began with competitor analysis and a SWOT analysis of existing music festival websites to identify opportunities for improving the user experience and strengthening brand differentiation.
This research highlighted the importance of making key user goals, such as purchasing tickets and accessing event information, immediately accessible. Three user personas were developed to represent the festival's target audience and guide decisions around information hierarchy, page structure, visual style, and content placement throughout the design process.
process highlights
swot analysis
The SWOT analysis identified opportunities to improve competitor positioning by prioritising the information users most frequently seek when visiting festival websites.
The key insight was that ticket purchasing was the primary user goal, leading to the implementation of prominent call-to-action buttons throughout the homepage. This research directly informed the page structure, content hierarchy, and overall user journey.
SWOT Analysis
wireframes
Low-fidelity wireframes were created to explore different approaches for navigation, hero imagery, content hierarchy, and ticket information placement.
After reviewing multiple iterations, the strongest design elements were refined into a high-fidelity wireframe created in Figma. This design established the final visual direction, including layout, typography, colour palette, and component styling before being translated into code.
interactive web development
The final website was developed using HTML and CSS, with JavaScript enhancements added during later iterations.
The completed build included the homepage and lineup page, creating a cohesive digital experience that reflected Elektrik Eel's energetic festival identity. The design incorporated a bold colour palette, strong typography hierarchy, artist imagery, and structured content layouts to ensure information remained engaging and easy to navigate.
Additional development improvements included responsive layouts, a JavaScript-powered mobile hamburger menu, and hover interactions to enhance usability and provide a more polished experience across devices.
outcome
The final deliverable was a complete website developed across the homepage and lineup pages, delivered as a functional HTML, CSS, and JavaScript project folder.
The finished experience successfully translated the Elektrik Eel brand into a digital platform, balancing visual impact with usability. The project strengthened my ability to move from research and interface design through to front-end development, while considering responsiveness, interaction design, and user needs throughout the process.
reflection
As my first project developing with HTML, CSS, and JavaScript, this project provided valuable insight into the relationship between design and front-end implementation.
The process reinforced the importance of iteration, testing, and translating visual concepts into functional experiences. Looking ahead, I would introduce more opportunities for user testing earlier in the process and continue exploring JavaScript interactions to create more dynamic and engaging digital experiences.