top of page
Digilifeap.com
website design, brand consulting
Digilifeap.com
October 2023
Redesigned the Digilifeap.com website to resolve usability frustrations and outdated visuals, applying UX/UI principles to create a more intuitive, engaging, and accessible experience. This case study demonstrates how strategic interaction design and refreshed visual systems can transform a stagnant platform, improve partner satisfaction, and strengthen overall brand perception.
The challenge
The Digilifeap.com website had remained stagnant for years, with several known usability issues affecting visitors' engagement. As a company without a website, I set out to establish Digilifeap.com and build its online presence from the ground up. 

As a first-time WordPress user, I faced several challenges, from learning the platform's interface to customizing the design and functionality to fit Digilifeap.com's needs. Navigating themes, plugins, and site structure required a learning curve, but it was a valuable experience in building a strong online presence from the ground up.

My goal was to enhance the user experience, refresh the visual identity, and optimize the site to attract more clients for video and film production services. Another challenge was working within the existing framework, as a full back-end overhaul wasn't an option.
A user-flow approach
I began the project by mapping a comprehensive user-flow diagram to define the ideal journey for visitors, ensuring the website offered a seamless, intuitive, and purposeful experience. This exercise clarified the site’s information architecture and guided the transition into sketches and wireframes, allowing design decisions to be anchored in user behavior and goals.
Collaborating closely with the client, I gathered insights on how they wanted users to perceive the brand and interact with the site. These insights informed the design direction, ensuring the final product struck a balance between user needs, business objectives, and brand vision.
Strategies

  • Establishing a clear, goal-oriented user journey

  • Identifying and optimizing critical touchpoints

  • Mapping user intentions to inform content and interactions

  • Prioritizing simplicity, clarity, and intuitive navigation

  • Maintaining flexibility in the flow to accommodate feedback and iterative design

  • Collaborating closely with the client to align on vision and user experience

Research & Discovery
I began by identifying user needs and business goals through discussions with the client and a review of the existing site. The main challenge was that users struggled to find relevant information and often dropped off before taking meaningful actions. I also researched competitor sites to understand industry standards and user expectations.
User Journey Mapping
I mapped out how users would naturally interact with the site, from their initial visit to completing desired actions such as exploring the portfolio or contacting the business. This process highlighted key moments where clarity and guidance were essential, ensuring the overall flow felt intuitive and purposeful.
Information Architecture
Based on the journey map, I structured the site’s content into essential pages: Homepage, Services, About, Portfolio, and Contact. Each page was designed to play a specific role in guiding users forward, creating a meaningful and efficient navigation path.
Wireframes & Prototyping
Facing client resistance to traditional wireframes and a tight project timeline, I adapted by using the live WordPress design as an interactive prototype. This approach allowed me to demonstrate each step of the user journey in context, gather real-time feedback, and iterate quickly. By embedding the design process directly into the working site, I maintained a user-centered focus, reduced friction, and ensured the final experience met both user needs and the client’s vision, despite the project constraints.
header.01a 1.png
developed a design system using bold typography, a clean layout, and consistent visual elements that reflected the brand identity. The visual layer was carefully balanced with usability, ensuring content remained accessible and easy to engage with.
Visual Design
Outcome
The redesigned Digilifeap.com delivers a cohesive, user-centered experience that balances visual storytelling with intuitive navigation. The full-width hero banner, featuring video content and subtle micro-animations, creates an engaging first impression while guiding users toward key actions. Streamlining the carousel and adjusting animation timing allowed content to breathe, minimizing distractions and keeping users focused.
Overall, the site now encourages exploration of the portfolio, facilitates meaningful interactions through the contact form, and strengthens the brand’s creative identity. By aligning design decisions with user needs and behaviors, the redesign improved usability, increased engagement, and established a modern, immersive experience that connects the audience more effectively with the brand.
Showcasing work
To highlight the depth and quality of Digilifeapap.com’s portfolio, I took a user-centered, visual-first approach that prioritized the brand’s video content. Recognizing that visitors come primarily to experience film and storytelling, I designed an interface that immerses users in the work while maintaining intuitive navigation. Layouts, visual hierarchy, and interactive cues were carefully crafted to make exploration effortless, allowing users to focus on the content, understand the breadth of the portfolio, and engage meaningfully with the brand’s creative work.
Feature Film
We bring cinematic storytelling to life through compelling narratives and high-quality production values.
Television
From episodic content to broadcast-ready segments, our work is tailored for impact on the small screen.
Commercial
We create visually striking and message-driven commercials that connect brands with their audiences.
Corporate Video
Our corporate videos are crafted to communicate brand identity, values, and services with clarity and style.
Documentary
We tell stories with authenticity, capturing moments that inform, inspire, and engage viewers.
To showcase Digilifeap.com's extensive video portfolio, I designed a sleek, interactive carousel as the centerpiece of the “Our Work” section, prioritizing both cinematic impact and usability. Recognizing that visitors come to experience the brand’s creative storytelling, I structured the carousel to be scrollable and curated, making it easy for users to navigate without feeling overwhelmed. Smooth transitions, hover effects, and preview thumbnails were implemented to guide exploration, provide immediate feedback, and highlight key projects. This user-centered approach ensures an engaging, intuitive experience that encourages interaction while reinforcing the brand’s creative identity.
Objective
Highlight the depth and quality of the brand’s portfolio while keeping navigation intuitive. My approach was to developed a user-centered, visual-first portfolio section that prioritized video content. Designed an interactive carousel that balances storytelling with usability, allowing users to explore projects without feeling overwhelmed.
Process
  • Structured the carousel with smooth transitions, hover effects, and preview thumbnails to guide exploration.

  • Reduced cognitive load by curating the number of visible projects and maintaining a consistent layout.

Outcome
Users can engage with the portfolio seamlessly, gaining an authentic understanding of the brand’s creative capabilities. The interactive design encourages exploration, reinforces visual storytelling, and strengthens brand perception.
To showcase Digilifeap.com's extensive video portfolio, I designed a sleek, interactive carousel as the centerpiece of the “Our Work” section, prioritizing both cinematic impact and usability. Recognizing that visitors come to experience the brand’s creative storytelling, I structured the carousel to be scrollable and curated, making it easy for users to navigate without feeling overwhelmed. Smooth transitions, hover effects, and preview thumbnails were implemented to guide exploration, provide immediate feedback, and highlight key projects. This user-centered approach ensures an engaging, intuitive experience that encourages interaction while reinforcing the brand’s creative identity.
About us hero
I incorporated subtle micro-motion on the "About us" hero page to add a sense of depth and interactivity. These animations guide the viewer's attention and create a smoother, more engaging user experience without overwhelming the content
Objective
Enhance the “About Us” hero section with subtle interactions that guide users, support storytelling, and reflect the brand’s creative energy.
Approach
I implemented micro-interactions to create a sense of depth and motion without overwhelming the content. Each animation was designed to provide intuitive visual cues, directing attention to key elements and reinforcing the information hierarchy.
Process
User Considerations: Evaluated how users scan and process hero content to ensure animations would support comprehension rather than distract.
Motion Design: Added gentle hover effects, fades, and transitions to buttons and key visuals, creating an interactive, engaging experience.
Iteration: Tested motion timing and placement to maintain accessibility and avoid sensory overload, refining animations based on user feedback and usability principles.
Integration: Ensured micro-interactions complemented the overall visual design and storytelling, strengthening the site’s personality while guiding users through content seamlessly.
Client partners
I developed a user-centered, visual-first portfolio section that prioritized video content. Designed an interactive carousel that balances storytelling with usability, allowing users to explore projects without feeling overwhelmed.
Process
  • Structured the carousel with smooth transitions, hover effects, and preview thumbnails to guide exploration.
  • Reduced cognitive load by curating the number of visible projects and maintaining a consistent layout.
Contact page
The Contact page was designed to provide a clear, welcoming, and friction-free experience, serving as a direct bridge between the brand and its audience. I focused on simplicity, including only the essential fields needed to initiate a conversation, while organizing content with clear headings and intuitive form placement. Consistent visual design and hierarchy guide users naturally through the process, building trust and confidence. Whether a potential client, collaborator, or curious visitor, the page ensures taking the next step, reaching out—is effortless, accessible, and user-centered.
Welcoming new opportunities
With the redesign complete, Digilifeap.com now offers a user-centered experience that reflects the brand’s creativity, professionalism, and cinematic energy. The refreshed design not only presents the portfolio more powerfully but also guides users seamlessly through the site, encouraging engagement and meaningful interactions. By removing friction, enhancing clarity, and highlighting the brand’s strengths, the platform opens doors for new collaborations, partnerships, and future growth. What began as a need for a digital presence evolved into a strategic, immersive platform, one that positions the brand to welcome new opportunities while delivering a memorable, engaging experience for every visitor.
Project overview
Title: Website design (RWD)                                                                                                        Client: Digilifeap.com
Industry: Film & Video                                                                             Duration: October 2023 - February 2024
Role(s): Principle Designer, UX/UI designer, Front-end developer, Content strategist, Product Manager, Analytics specialist, QA tester
Tool(s): Figma, Adobe Creative Suite, WordPress
​
bottom of page