Installation services
on NetOnNet.se
Summary
In cooperation with Hemfixarna, NetOnNet offer their customers professional help with installation of TV’s, soundbars, mobile phones, routers, etc. Up until this point, the offer was limited to customers visting any of the physical stores around the country, but with this new digital solution, customers are able to place orders on installation services on NetOnNet’s E-commerce site.
The user
The primary target group for NetOnNet are those who are on the lookout for a product, like a TV or a robotic lawn mower, who are also in need of help with either installation or assembling the product. The second, and smaller, target group are those who has already bought a product that they need help fixing or installing later on in the journey. Both groups are generally people in their 60’s-90’s who, for different reasons, can’t install their products by themselves.
Both groups in question are generally quite hesitant when they consider buying installation services, asking themselves questions like:
“When and how do I make the payment?”
“What if something breaks during installation?”
“What kind of background do the technical installers have?”
“How can I trust the person who’s coming into my house?”.
The design problem
Until the launch, customers on NetOnNet had only been able to get help with installation and montage by visiting the physical NetOnNet shops. Customers shopping online were left to install their equipment on their own, or reaching out to an external party. NetOnNet saw this as an opportunity to bring installation services to the e-commerce site. The challenge was to do this in a way that would be satisfying to the customers, as well as adjusting to the technical limitations and temporal rescouces at hand.
The solution
1) New landing pages
Landing pages, or “a home” for the installation services was the very basics of the project, since customers need to feel informed to feel safe. To create a focal point for information was also crucial in building trust and credibility for the partner who owns the services.
3) Adding the services to the product pages
Drawing benefit from the area that NetOnNet usually uses for recommending accessories, a suitable installation service got it’s own place on the product pages of for example TV’s and Soundbars. This solution benefits both “browsers” (those who are just scanning) and “hunters” (those who are on the lookout for something specific).
3) Offering installation services in checkout During checkout, customers are generally more inclined to think more seriously about their purchase, which is why it can be effective to give the customer a targeted offer in the shopping cart.
Other than that, I also had to make design changes to the order confirmation e-mail and the main navigation, as well as giving suggestions for ways to improve the MVP in the future.
Methods/tools:
Use cases
Service Blueprint
Benchmarking
Subject matter expert interview
My role:
UX-designer with main responsibility of the project from start to finish.
Challenges:
The first challenge was to communicate to the client and the PO that this intial project should prioritise getting the main flow in place before we try to weave the offer into the main customer journey (The “main flow“ being the landing pages for the installation services). The argument for this was based on insights from the SME-interview that stated that customers will want to know in detail what the services is all about, in order to feel safe.
A second challenge was that the project was aimed at the lowest amount of effort as possible, making it a very real MVP, a first effort to “just get the services out there”. Along with limited technical and temporal resources, this made it challenging to create a customer journey that was both as enjoyable, understandable, and aesthetically pleasing as I’d like.
Examples of design changes
1) The first picture represents the design solution that I decided worked best for the landing pages, considering the many technical limitations we had.
2) The second picture shows the outcome after me and another colleague put our two projects into one design solution.
(Click the pictures to expand)
.
The process
1. Planning & strategy
Methods/contents: Use cases, design thinking/double diamond
Description: Through communicating limitations and scope around a set of use cases, we synchronised estimated delivery for the project together. In this stage of the process, I also planned the whole project, where I followed a relatively clear design thinking process.
2. Empathise
Methods/contents: Benchmarking, SME-interview
Description: Due to the short amount of time over which the project spanned, I chose to conduct a subject matter expertt interview. For this I reached out to one of the more experience custumer service employees at Hemfixarna, whom I asked a lot of questions that intended to uncover the end users’ goals, attitutes, fears, and needs.
3. Define
Methods/contents: Thematic analysis, summary of all insights
Descriotion: I analysed the qualitative data that I had, in order to take the project in the right direction and to answer to customers needs and wants , as well as business goals.
4. Ideate
Methods/contents: Skiss och brainstorming
Description: I worked with conceptual ideas, and then began to focus on how the flow would fit into today's platform without getting stuck on possible technical limitations.
5. Prototype & test
Methods/contents: Prototyp och guerillatestning i 2 omgångar
Description: I conducted two rounds of usability testing, in the form of guerilla tests. The first iteration focused on the basic flow, where I wanted to find out if customers understood what they were looking at, and the second iteration was aimed at figuring out how well they understood the details.
6. Implement
Description: Even though I’d been in contact with developers during the whole design process, as the development of the product progressed, more and more technical limitations were discovered. This meant that we, together with the client and product owner, had to make certain trade-offs while keeping the MVP viable, without damaging the user experience too much.
Some more visuals
The first prototype had three levels of navigation
Description: Above is a part of the first prototype, respresented by landing pages in thee levels, in the same way that the rest of the site is built. An insight from early on in the process, though, was that this made the flow unnecessarily complicated considering how much of the infomration was repeated on each page.
The second prototype included a one-pager
Description: In the second prototype it’s more visible that I’ve started to adjust to the technical limitations that had arisen. Before the second test round, I’d changed the thee level-navigation into a one-pager, based on insights I’d recieved earlier on. This resulted in easier scanning and less unnecessary content redundancy (and possibly also a less visually pleasing experience, all according to plan, though!).
Description: This is the final design, a conciously trimmed down version of the earlier concepts due to temporal and technical limitaitions that were decided by stakeholders to give the project it’s scope. Minimal viable product is the word. To manage this, I collaborated with developers and PO throughout the development process.
One of the contributions was making a new area for showing both suitable accessories and services.
Description: The idea to place installation services on the product page originated from this project, whereas the main work with creating the actual component was realised by a design colleague.
A few changes to the order confirmation e-mail also had to be made
Description: Of course, I also had to take into consideration the order confirmation letter.
A The project also initiated design changes in NetOnNet’s checkout
But due to confidentiality reasons, I can not yet show these design changes. In time I’ll make an update. :)
The final solution had to be a trimmed down version of the best concept
Click the picture to expand
Click the picture to expand
Click the picture to expand
Click the picture to expand
Click the picture to expand
Insights
On important text steps
During the explorative phase I saw many ways to improve the product. Here are a few steps that I recommended to the client and PO:
1. Explore how to improve/solve technical limtations that impacted this project negatively
2. Consider implementing questions and answers directly on the infromation pages for a more intuitive and accessible customer journey
3. Consider using words as “book” or “preliminary booking” instead of “buy” (since it can confuse the customers)