Next Gen Hub
Microsoft Edge is a web browser developed by Microsoft.
Hub is the one place for user to save their favorite websites, books and etc.
Minmin brought up the idea to expand the use of hub.
My Role
concept thinking, UX flow, wireframe, design and prototype by Minmin Shi,
Minmin was involved in a series of concept brainstorming show in Microsoft Edge team,
This is one of the idea she presented.
Question
In edge browser, How can we make Hub (favorite folder)
more customizable, accessible and easy to use.
Meet the Users
Nataly Osmann
Fashion Blogger
Painpoint
Nataly creates contents on social media, she take fashion photos, write articles about the new fashion trends, make videos,
she searches multiple types of medias in the browser for influnece.
-
when she research for images, articles, videos, she can't save multimedia in one place and organize them easily.
-
after saving to local, she can't trace back the original URL unless she repeat the search.
-
She purchase stuff from too many different websites, it's hard to track every order from so many places, she sometimes saved item in cart but later forgot which website she saved to.
Goals
-
Nataly want to effortlessly save all the media, photos, article, quotes in one place, and organize them efficiently.
-
She want to have a place to track all her orders from multiple websites,
-
have a place to save all the stuff she wanted to purchase and purchase in one place instead of going to multiple websites.
James Bamford
Homeowner
Painpoint
James is renovating his new home, he search existing home improvement ideas online.
He works with contractors, share his ideas with them for construction.
His wife would also send him list of construction materials to purchase.
-
it's hard to share his photos with contractors, sometimes need to add comments to the reference image, but it's complicated to do so.
-
he can't share his favorite list to others
-
Every time he gets a long list of items to purchase from his wife, he has to click into each list and purchase from multiple websites, he sometimes even missed a few because it's hard to organize so many shopping websites.
Goals
-
James want to share the ideas with contractors easily. able to comment on the ideas.
-
He want to be able to save all the shopping list from multiple website at one place so that his wife could share the shopping list with him effortlessly
-
He want to be able to purchase items at one place instead of getting lots of links
Linda Eliasen
Illustrator & Designer
Painpoint
Linda makes graphic design and illustration, she research existing art work for influence,
She also look for assets to be used in her design, she has a large library of images.
She need to share her ideas with other colleagues
-
Linda uses browser heavily for image searching, saving images needs too many clicks and choosing folders.
-
It's hard to navigate through many images
-
can't find the original URL where she saved the image
Goals
-
Linda wants to be able to save lots of images with minimal steps possible,
-
she want to organize the images easily and share with colleague
-
she want to save groups of images effortlessly
-
She want to see similar types of images
Existing Problem
1. Favorite website in the hub is hard to navigate, user can't save individual item,
2. user can't share favorite list
3. if user save to local, they can't trace back to original URL.
4. shopping is hard to manage due to too many websites.
Goals
Minimum Steps
Use minimum clicks to save the item
Informational
user could get more info from the saved item
Easy to Organize
easy to organize after saving
Clear to Navigate
use image more instead of text and favicon for saving favorites
Convenient to Share
share with people without huzzle
Customizable
could save image or video or quotes in one board
Benchmarking
Save websites in one place
Save images on online board
Save text or videos on online board
Save item with 1 drag & drop
Save groups of images to local with 1 click
Able to go back to original URL
Share with others
Save shopping list
Share shopping list with others
Check order updates in one place
Purchase item from multiple websites in one place
Thumbnails for easy access
Current hub
Next Gen Hub
Dribbble
Google.com
Easy to organize with drag and drop
Ideas
Discoverability
save with minimal steps
Use drag & Drop, trigger a list of buckets on the side of the browser
when users are trying to drag and drop the image to their local, it helps to make the feature more discoverable,
user could make the select, choose location and save in folder one click with drag & drop.
Save targeted item
Able to trace back to the original URL
Save the image, video or quotes in the browser and keep the original URL when user open it,
so they could trace back to the original website when they want to.
Manage Shopping
User can add items to the universal shopping hub from multiple websites,
then check out in one place in the shopping hub.
user could manage their orders in the shopping hub instead of going to multiple websites.
User Flow
Next Gen Hub Experience
Universal Shopping Experience
Iterations
.
Wireframes
.
Prototype
prototypes made quickly to share the idea
They were design and animated within a few hours to present my idea, so a bit rough
Drag&Drop to save Images in the Hub
Universal Shopping Experience
Challenges
1. It's challenging to find a way to save the item to the desired location with minimum clicks,
2. With minimum steps, it's challenging to make it clear where user's item is saved to.
3. It's challenging to make the feature more discoverable but yet not too disturbing.