Category
UI/UX • Front End Development
Brand
CodeDXB
Year
2026
Timeline
~2 wks
UAE's Premier AI & Technology Conference Platform
Project Brief
The client needed a conversion-focused conference website for CodeDXB the UAE's flagship AI and technology summit targeting enterprise decision-makers, C-suite executives, and regional tech leaders.
The brief was straightforward but the pressure wasn't: build a platform that could handle multi-audience registration flows (sponsors, exhibitors, visitors, media), communicate authority in a competitive regional market, and go live fast. No existing design system. No brand UI history. Just a logo, a vision, and a deadline.
My role: Sole UI/UX Designer and Frontend Developer.
Constraint: End-to-end delivery: design, build, QA, and deploy.
The Core Problem
The UAE tech conference market is saturated with high-budget competitors like GITEX, Expand North Star, that have years of brand equity and dedicated web teams behind them. A new entrant like CodeDXB couldn't compete on scale yet, but it could compete on clarity, credibility, and conversion.
The core problem: How do you make an enterprise audience trust a brand-new conference enough to register, sponsor, or exhibit?
The previous digital presence didn't answer that question. Additionally, it was built from a Wix website so I have to migrate the contents. The old website has no clear hierarchy of who the platform was speaking to, no distinct value proposition for each audience type (visitor vs. sponsor vs. exhibitor), and no design language that signaled premium positioning.
Baseline Audit, Before Redesign
| Metric | Baseline |
|---|---|
| Avg. session duration | 1m 12s |
| Bounce rate | 71% |
| CTA click-through rate | 4.2% |
| Registration form completion | 18% |
| Mobile engagement rate | 31% |
Data based on pre-launch audit only.
Competitive Research
I audited four competitors across local and international markets to identify gaps and define positioning.
The Solution
Before opening Figma, I needed to understand who was actually using this platform and what they needed to be able to do. I ran a WhatsApp thread and a Google Meet session with the internal stakeholders and account managers who were closest to the client, since direct exhibitor access wasn't available at this stage.
The questions I focused on:
- Who are the three types of people arriving at this site and what does each of them need to find within the first 10 seconds?
- What’s the current registration process and where does it break down?
- What does a sponsor need to see to feel confident enough to enquire?
- What has caused confusion or drop-off in previous event communications?
I collated the answers in a Figma whiteboard by grouping pain points by audience type (visitor, sponsor, exhibitor) and mapping what each group needed, in what order, to move toward a conversion action.
From there I built a user flow diagram before touching any UI. Only once that flow was validated did I move into high-fidelity design.
Frontend execution ran in parallel with final design revisions, with QA and deployment on Vercel closing the project out.
Brand Guidelines
The CodeDXB identity anchored around the tension between code and enterprise where technical credibility meets the executive audience. For the visual system, I collaborated with a graphic designer to collate my visions and stakeholder's visions and this is what I used all throughout the project:
Color: Near-black base (#0F0C05) for primary text, electric-blue accent (#0000EA) for CTAs and electric pink (#E501A0) for highlights only.
Typography: Clean Objectivity hierarchy, large editorial headings, tight body copy, generous whitespace. Designed to feel like a publication, not a brochure.
Tone: Direct, confident, industry-peer. Not salesy. The copy treats the reader like they already belong in the room.
Tools I Used
The stack that powered this project from design to deployment.
I used Figma for brand assets, icon design, and visual references. Adobe Illustrator handled logo refinements and vector assets. For copy drafting and content structuring, I leaned on Claude to move fast without sacrificing quality. The entire frontend was built in Windsurf, with GitHub for version control and repo management, and Vercel for deployment and hosting.
The Outcome
The platform launched on schedule and is currently live, actively used for the October 2026 event cycle. Sponsor and partner logos from ATEX International, Mutant, Tech-Z Magazine, and The Agenda are live on the site, real organizations with real brand equity trusting the platform publicly.
Post-launch Results (vs. baseline)
| Metric | Baseline | After Launch | Change |
|---|---|---|---|
| Avg. session duration | 1m 12s | 2m 48s | +133% |
| Bounce rate | 71% | 44% | −38% |
| CTA click-through rate | 4.2% | 11.7% | +178% |
| Registration form completion | 18% | 41% | +128% |
| Mobile engagement rate | 31% | 67% | +116% |
What I Took From This
The single biggest lesson from CodeDXB was that audience segmentation converts. Restructuring the navigation around three distinct user types (visitors, sponsors, and exhibitors) instead of a generic menu meant each audience found their path immediately. The registration numbers reflected that. It sounds obvious in hindsight, but the previous site treated everyone the same, and it showed in the bounce rate. Dark mode wasn't just an aesthetic choice either. For an enterprise tech event competing against government-backed conferences, it communicated seriousness and premium positioning that a light-mode alternative simply couldn't. Every design decision was strategic, even the ones that look purely visual on the surface.
Speed was a feature in itself. The entire platform, from first design to live deployment, was delivered within the project's fast-turnaround timeline. That speed meant the client had more time to focus on what actually matters for a conference: securing speakers, building partnerships, and filling seats. They weren't waiting on a digital team to finish a website while the event date crept closer.
