Oyoun Media
A full-scope website redesign for a leading digital agency and integration of a built-in design studio & shop ‐ unifying online services, offline branding, and e-commerce into a single, commanding digital presence.
Bridging the gap between offline credibility and digital presence
Oyoun Media is one of Palestine's most established marketing agencies with 10+ years of operation, 835+ delivered projects, and partnerships with brands like Pepsi, Pizza Hut, and Saniora. But their digital footprint didn't match their real-world reputation.
Their existing website failed to communicate the breadth of their services — spanning digital marketing, billboard/LED advertising, software solutions, and instore branding. Prospective clients couldn't quickly understand what Oyoun does, let alone purchase services or request quotes online.
The challenge: design a platform that unifies Oyoun's dual identity (online + offline services) into a cohesive, conversion-focused website with integrated e-commerce, while positioning them as the #1 digital agency in Palestine.
Understanding the landscape
We combined stakeholder interviews, competitive audits, and service-usage analytics to map Oyoun's unique positioning in the Palestinian digital market.
Dual-channel identity is a strength, not a weakness
Clients value that Oyoun handles both digital campaigns and physical branding (billboards, LED screens, instore). The website needed to celebrate this duality rather than hide the offline side.
Most agency sites in the region lack self-service
Competitors relied solely on contact forms. No agency offered productised services with transparent pricing or an e-commerce component — a clear market gap for Oyoun.
Case studies drive 3x more engagement than service pages
Existing site data showed that visitors who viewed project portfolios were three times more likely to submit a contact request, validating a case-study-forward content strategy.
Mariam Al-Khatib
Goals
Find a single partner who can handle both her digital campaigns and in-store launch activations. Wants transparent pricing and fast turnaround.
Frustrations
Tired of coordinating between separate digital and offline vendors. Previous agency websites showed little proof of results.
Behaviours
Browses LinkedIn for agency recommendations. Evaluates agencies by their portfolio quality and client logos. Prefers WhatsApp for initial contact.
Quote
"I need to see that you've done this before — for brands like mine."
Competitive Landscape
Structuring the experience
We organised Oyoun's sprawling service catalogue into a clear hierarchy that guides visitors from awareness to conversion.
Key User Flow — Service Discovery to Quote Request
Land on Home
Hero section with clear value prop and stat badges build immediate credibility.
Browse Services
Online/Offline toggle lets users filter by channel. Productised cards show ratings and pricing.
View Case Study
Detailed project page with outcomes, process breakdown, and related work builds trust.
Request Quote
Persistent "Get A Quote" CTA triggers a focused form with service pre-selection.
Confirmation
Success state with estimated response time and WhatsApp fallback link.
From rough sketches to refined layouts
We explored multiple layout concepts before converging on a design that balances editorial storytelling with e-commerce functionality.
Hero Approach — Option A vs B
Full-bleed video hero
Background video reel of campaign highlights. High visual impact but heavy load times and potentially distracting from the core message. Tested poorly on mobile connections.
Stat-driven dark hero with floating badges
Clean dark canvas with bold typography, floating achievement badges (Award-Winning, 1,000+ Campaigns, 99% Satisfaction), and a clear CTA. Communicates credibility instantly, loads fast, and works flawlessly across devices.
Visual language & components
Colour Palette
Typography Scale
Component Library
Buttons
Form Inputs
Tags & Labels
Stat Badge
The finished product
A dark, confident visual language that lets Oyoun's work speak for itself, while guiding visitors toward conversion at every turn.
Homepage — Hero & Above the Fold
The hero combines bold typography, floating achievement badges, and a clear "Get In Touch" CTA. A promo banner drives shop traffic.
Services & Product Cards
Productised service cards with ratings, pricing, and instant quote CTAs bring an e-commerce feel to agency services.
Case Studies & Offline Service Customization
Each project gets a dedicated page with process breakdown, tagged categories, and related work suggestions to keep visitors engaged.
Supporting Pages
Case Studies list, Get Quote, and Service List pages maintain visual consistency while serving distinct user intents.
Purposeful micro-interactions
Every animation serves the user — guiding attention, confirming actions, and creating a sense of polish that matches Oyoun's brand positioning.
Scroll-triggered stat counters
The "Oyoun Stats" section uses animated number counters that increment as the section enters viewport, turning static numbers into an engaging moment of discovery.
Service card hover reveals
Product cards feature a subtle lift and glow on hover, with the "Get A Quote" CTA sliding into view. This progressive disclosure keeps the grid clean while rewarding exploration.
Testimonial carousel
Client quotes auto-rotate with a smooth crossfade, each accompanied by their rating. Manual navigation dots let users browse at their own pace.
Parallax hero badges
The floating achievement badges in the hero section move at slightly different scroll speeds, creating depth without distraction. Subtle but intentional.
The numbers speak
Lessons learned
What went well
The productised service card approach was a breakthrough — treating agency services like e-commerce products with ratings and pricing dramatically simplified the user's decision-making process. The dark visual language also differentiated Oyoun from every competitor in the region using generic light themes.
What I'd do differently
I'd invest more time in the Arabic localisation layer from the start rather than treating it as a follow-up phase. For a Palestinian agency, the RTL experience should be a first-class citizen, not an afterthought. I'd also prototype the checkout flow more thoroughly before moving to high-fidelity.
