Basket is a new application meant for online grocery shopping list management. I designed two wireframe versions of Basket application: Basket application for mobile devices (mainly iPhone) and a desktop version. I wanted the interactions with the application to be:
1) Usable and fun to use
2) Easy to adapt
3) Consistent between two apps
2) Easy to adapt
3) Consistent between two apps
Consistent design theme found in both (desktop and mobile) applications can be seen when going down the page. This also helps the design to seamlessly flow between full web version and the mobile version.
Clear visuals and use of white space groups symbols and text together to form a Gestalt. Use of symmetry and clear lines throughout the entire design of both the full web version as well as mobile version.
• IusedBalsamiqtodesignwireframes.
• It took about 2-3 working days to plan, design and test this project.
• It took about 2-3 working days to plan, design and test this project.
MOBILE VERSION
Mobile version of the application uses basic mobile swipe functions in contrary to desktop version’s drop down menus. The elements will also fill the whole mobile screen. User might use mobile phones only minutes, so there will be more minimalism on the screen.
As you can see, there are same functionalities to delete, comment and assigning than in desktop version. In addition to scrolling down the whole list and adding items, there is a “+” sign. Using the “+” sign it is possible to add items to the list easier than scrolling down if the list is full of items.
DESKTOP VERSION
The dropdown menu introduces three different options: Deleting an item, adding a comment and assigning item to friend. Items can be marked and they turn blue after marking. Commentation section is located under the list item, using light grey font.
