ARXFans | Responsive Website

Image of a tablet on a kitchen wall.

Summary

This is the ARXFans app landing website where I worked as a designer and front-end developer.

Product type: Website

View live product at arxfans.com

About the product

About:

This website is an invitation for fans around the world to download the ARXFans app to support and celebrate their national football team.

The User:

Fans around the world who would like to learn more about the ARXFans app to support their national football team.

The Goal:

The goal for this website is to inform users where to download the app, device compatibility, what they can do with the app, and learn more about the privacy policy which is required by the App Store.

My Role:

For this project I worked as a Designer and Front-End Web Developer. My responsibilities were working on wireframes, visual design, prototyping, and development with HTML, CSS, and JavaScript.

Design Process

Image of green sticky notes

Organizing information:

Before starting the design, I organized the required information and content that needs to be included in the website.

Image of squares with text inside representing website requirements.

Paper Wireframes:

Image of paper wireframes

Digital Wireframes:

Image of digital wireframes
Image of digital wireframes

Wireframes to hi-fi designs:

Image of paper wireframes

Final Product:

View live product at arxfans.com

Development:

Once the high fidelity design was approved by the manager, I implemented the design to code using HTML, CSS, and JavaScript.

Blurry image using background blur to cover code of a website.
Mockup of a website displaying on a mac, iPad, and iPhone.

View live product at arxfans.com

Tools used:

  • Figma
  • Adobe XD
  • HTML
  • CSS
  • JavaScript

Thank you for watching!