Irving Suna Logo
Back
Web Platform · Sports

FIFA World Cup Stadium Website

Client
Itaipava Arena Pernambuco / Odebrecht
Role
UX/UI Designer
Summary
UX/UI design for the official website of Itaipava Arena Pernambuco, built for the FIFA World Cup 2014 in Recife, Brazil. The platform included a 360° virtual tour, event scheduling, ticket purchasing, and interactive gate maps for a 46,154-capacity venue.
UI/UX Design project intro — Itaipava Arena Pernambuco logo featuring a 3D gold layered oval mark and bold wordmark, centered over a dramatic stadium interior photograph with silhouetted fans in the foreground.

Problem

Itaipava Arena Pernambuco was one of the stadiums built for the 2014 FIFA World Cup in Brazil. The site needed to communicate the scale of the venue while giving fans a clear way to buy tickets and find the right gates on event days.

Solution

I designed the website to give visitors a strong sense of the arena before arriving. A 360° virtual tour let users explore different sections of the stadium at their own pace. The homepage kept upcoming matches front and center, with ticket purchasing reachable in a few steps. The site also included maps and directions so fans could find their gate and plan their route to the venue.

Results

The site gave Itaipava Arena Pernambuco a strong online presence for the 2014 FIFA World Cup. Fans could browse the schedule, buy tickets, and find their gate from the same platform. The 360° virtual tour gave visitors a way to explore the stadium before the event.

Website Visuals — Itaipava Arena Pernambuco homepage in a desktop browser mockup. The hero section features the next match (Náutico vs Grêmio) with team crests and a Buy Ticket call-to-action. Below: news thumbnails, an Upcoming Events schedule section, the Clube Arena Prime premium area with a lounge photo and Explore in 360° CTA, and a Facebook social proof counter showing 159,269 fans. Colors and Inner Pages — color palette swatches (dark red, red, copper, cream). Two desktop page views: left shows the Arena history section with aerial stadium photography and an Explore the Arena in 360° CTA with the Odebrecht sponsor section; right shows the How to Get There page with an interactive bird's-eye map and color-coded stadium gate location diagram. Schedule and Press pages — left column shows the Schedule page with event listings (Náutico x Santa Cruz, O Maior Show do Mundo) displaying dates, team crests, and ticket CTAs, plus an expanded event detail view; right column shows the Press page with a stadium photo gallery grid and an accreditation request form. A smaller schedule detail view is shown at bottom right.
Closing slide — itaipavaaarenapernambuco.com.br — Thanks for Watching! — irvingsuna.com — black background with yellow smiley face and gold horizontal lines.

Want to learn more about this project?
hello@irvingsuna.com