Argos - iOS

Taking one of the UK's largest e-commerce retailers to new levels and experiences with Augmented Reality and Visual search technology.

Timeframe - Jan 2018 - Mar 2019         Role - Senior UI Designer

Timeframe - Jan 2018 - Mar 2019         
Role - Senior Product Designer

argos-ios-hero@2x

Overview

Overview

My Role

iOS App userflow

iOS App userflow

argos-ios-ux@2x

Augmented Reality

Apple's AR Kit was first introduced to the public in June 2017 with Apple’s annual Worldwide developer conference and released in September 2017. As ambitious as Argos is, it was quick to realise the potential of Augmented reality and its many uses for retail and shopping apps. 

It wasn't until 2018 upon joining the apps team that Argos wanted to introduce AR into the iOS app as it had many benefits to e-commerce, including the reduction of returns.

argos-ios-ar-header@2x

Augmented Reality Userflows

Once we had confidently defined our AR concept, I created low fidelity wireframes and layouts which would get used in our testing lab. Initially, testing of the feature proved successful, but we hit a few roadblocks on the way, including our customer's understanding of the term AR. 

As we all worked in technology, the term AR came naturally to us. So we assumed that displaying a CTA with 'View in AR' would be the correct way to go, however in our testing lab it soon became apparent that our customers did not know what AR meant, and so we agreed to change the language to 'View in 3D'. 

Another issue we had was with the technology itself, and because the device had to calibrate and scan an area to recognise a surface, this proved difficult with blank white walls, and so we created the 'Wall mode'. The wall mode enabled the customer to create a surface by dropping a start and finish position, which created a surface between those points. This became useful when mounting televisions to walls. 

argos-ios-ar-wireframes@2x

Augmented Reality Design

After several months of design, iteration and testing, we launched Argos AR for our home & furniture category and in collaboration with Lego on several toy models.

I also redesigned every component within the app to be responsive and flexible. Therefore, the same components got used for the smallest device (iPhone SE) and the largest 12" iPad Pro. The design system is all aligned and utilising the same type scales, colour palette and iconography throughout all channels.

argos-ios-ar-finaldesigns-01@2x

Augmented Reality Surface Builder

During our testing phase of Augmented reality, we discovered limitations with Apple's ARkit framework, and it's inability to find surfaces which were blank, or of plain colour. This proved to be a challenge for us, as one of our goals in releasing Augmented reality was to allow customer's to place wall mounted products in their home, such as televisions. 

After experimenting with concepts and working closely with iOS developers, we agreed to enable our customers to manually build a virtual wall in their home, which would then allow them to visual a wall mounted product. We call it 'Surface Builder' and this augmented reality mode enables customer's to add 2 points A and B across the base of a wall which then virtually builds the surface between those two points. 

argos-ios-ar-finaldesigns-02@2x

Augmented Reality Interactions

iOS Visual Search

Once we had successfully launched AR, the innovation didn't stop there, and our next big project for iOS was a visual search. 

We discovered there were many use cases for this technology, and so with UX support fleshed out ideas of how this experience could work in the most seamless way possible. 

argos-ios-vs-header@2x

Visual Search Userflows

Once myself and UX support had defined our ideas, we worked closely with a developer to mockup a simple prototype of visual search as this would have been impossible given the current prototyping tools on the market.

Once we had created this mid-fidelity prototype, we then began testing, internally with colleagues but also with our customer's in our own testing labs. 

What we hadn't accounted for was the ability for our customer's to search for images which are saved to their devices, we assumed people wanted to search at the moment; therefore only had camera functionality. This resulted in us, including not only access to the native Photo library but also to an Argos Home Instagram feed.

argos-ios-vs-wireframes@2x

Visual Search Design

I released visual search in early 2019 with a simple yet effortless experience which enhances the current search functionality. This new technology adds a new depth to search and also contributes to helping customers with accessibility needs.

argos-ios-vs-finaldesigns@2x

PREVIOUS PAGE

NEXT PROJECT

❖ Anthony Eamens 2022©

Anthony Eamens 2020©