Mapper Website: A Unique Scrolling Experience

Creating an Engaging Journey Through Maps and Cars

The objective of the mapper website is to create an easy and engaging way to explain the need for mapper's products and services. By using an automobile that drives through a map filled with information, the website takes viewers on a virtual journey. The story begins with the needs of autonomous vehicles, showcasing how mapper's products meet those needs, and how their services will make autonomous vehicles lighter and less expensive.

To create the background texture for the website, the design team traced over a map of the San Francisco Bay Area. This texture has become a signature part of mapper's corporate identity and branding. The website is designed to fill screens of all sizes, from large TV screens to small smartphone screens, ensuring a seamless user experience.

The mapper website features a scrolling landing page that starts on the north side of the Golden Gate Bridge and moves south through San Francisco and beyond. The design incorporates mapper's branding colors of black, white, grey, and saffron. The scrolling leaves a saffron driving trail, allowing viewers to create a map of their journey through the landing page.

Throughout the scrolling journey, the website provides places for viewers to stop and read factoids about mapper's work. By the time viewers reach the bottom of the page, they will have gained an education on autonomous vehicles and how mapper contributes to the development of this industry.

The design process for the mapper website began in November 2017 and was completed in May 2018 in San Francisco, CA. Extensive research was conducted to understand mapper's unique technology and products. The design team worked closely with the CEO and engineers to gather information and create a cohesive story. Metaphors were used to explain complex concepts, and illustrations and infographics were developed to make the technical story easy to understand.

The mapper website presented several challenges, including defining the different products and services offered by the start-up company. With rapidly evolving technology and changing business models, it was crucial to meet with each team and understand their work in detail. A timeline was created to prioritize tasks and compile the story, ensuring a clear and understandable flow of information.

The mapper website has received recognition for its outstanding design. It was awarded the Iron A' Design Award in the Website and Web Design category in 2019. This award recognizes well-designed, practical, and innovative creations that meet professional and industrial requirements. The mapper website stands out for its integration of industry best practices, competent technical characteristics, and its contribution to a better world.

With its unique scrolling experience, engaging storytelling, and innovative design, the mapper website showcases the creativity and expertise of Colin Kent and his team. It serves as an excellent example of how art, architecture, design, innovation, and technology can come together to create a captivating and informative online experience.