Product Rec
Done for
Allconnect
Art Director
Dustin Putnam
Categories
Product, Web, User Experience, User Interface
Allconnect lets users browse through multiple broadband internet providers available in their location all in one place. The product recommendation tool would allow a user to answer 4 quick questions to get a plan recommendation that best fits their needs. It gets rid of the hassle of finding the available providers in their area & looking through 3+ provider websites to try to find the best value plan with the most reliable provider.
Four Steps
What activities do you do online?
Heavy gaming: more speed; streaming: medium speed; browsing: less speed
How many devices do you connect at once?
More devices mean more speed needed
What’s most important to you?
Is the user speed or price centric?
Where would you like service?
Providers & availability depend on exact addresses
Recommended for you
The best fit for you + similar plans from other providers
1st step
The first step is the only multi-select step. The problem became figuring out how to treat these multi-select buttons when the next 3 questions auto-progress to the next page. I settled on making the icon reinforce the selection for every button pressed and treating the actual button more like a checkbox than a button. If someone deselects an option, the icon switches back to the icon correlating to the last chosen option.
2nd step
The second step begins the first of the auto-progressing questions. When a user clicks a button, the number of circles in the icons will correlate with their selection before progressing them to the next step.
View an interaction sample on YouTube
Or see all of the product iconography I created on the Allconnect Illustrations page.
Interaction sample
See all of the product iconography I created on the Allconnect Illustrations page.
3rd step
At the beginning of the design process, the third step asked for a users preference: speed or price. After debate, we added in best value because more people are concerned with price than speed. Best value is based on an equation evaluating the highest speed for the most economical price.
4th step
The last step requires the user to put in their address. Allconnect only needs street & zip for an accurate address—the less form fields, the more likely someone is to make it through to the end.
The load time can range anywhere from 10 to 60 seconds, depending on the API speed. To compensate for this intense wait time, I created a loader to reinforce the idea of personalization. It spews back all of the selections that were made, their address & the 30+ logos of providers that partner with Allconnect.
RECOMMENDATION PAGE
Social
