38
Lauren Kay

Karmaloop Design Additions

Embed Size (px)

DESCRIPTION

some cool ideas and design that would enhance Karmaloop.com

Citation preview

Page 1: Karmaloop Design Additions

Lauren Kay

Page 2: Karmaloop Design Additions

CURRENT STATE

Page 3: Karmaloop Design Additions

FOUR AFFORDANCESParticipatory Encyclopedic

The main things that power the site are search engine and the shopping cart. Users can search for specific items, add them to the shopping cart, edit the shopping cart and overall make purchases.

There is so much technology out there that allows users to do so much more with sites.

I wish it could keep track of items I have re-cently looked at. There are so many differ-ent things on the site that it is easy to forget items you like or where they were on the site. There should be a space on the page that lists items you have clicked on. I also wish I could try on the clothes. There is so much variety on this site and it would be cool to see how different things look together.

The site has a wish list where you can keep track of clothes you like but aren’t quite ready to buy. This is not quick and effective as a recently viewed space, but it is a nice feature that would come in use. Since there site contains thousands of items there needs to be a way of sorting through everything. The items are lumped into categories that make sorting through them a lot easier. Even many categories have subheads so us-ers can narrow down their options.

I think the site does a good job of sorting items into categories and giving users nu-merous ways to find items. For example is I am looking for a t-shirt I can search through plan tees, graphic tees, or search a specific brand.

Page 4: Karmaloop Design Additions

SpatialProcedural

FOUR AFFORDANCES

The main things that power the site are search engine and the shopping cart. Us-ers can search for specific items, add them to the shopping cart, edit the shopping cart and overall make purchases.

There is so much technology out there that allows users to do so much more with sites. So what actions do I wish this site could magically do for me?I wish it could keep track of items I have re-cently looked at. There are so many differ-ent things on the site that it is easy to forget items you like or where they were on the site. There should be a space on the page that lists items you have clicked on. I also wish I could try on the clothes. There is so much variety on this site and it would be cool to see how different things look together.

The site is visually organized by links, sec-tions, and subheads. Items are listed in columns where users scroll up and down to view more items

There are different ways of organizing things to make it more pleasant for the user.What kinds of mapping and visual organi-zation of info would help me use this site more fully?Instead of searching for clothes up and down like we are used to, there should be an option to scroll left to right. This would definitely come into use for people using phones or tablets. This would clear up clut-ter around the page and put everything into a more concrete frame where users do not have to constantly scroll down or constantly click to view more pages.

Page 5: Karmaloop Design Additions

New Arrivals

Clothing

Accessories

Footwear

Total: 75.00

Victoria pleated shirt 25.00Raw Denim jeans 50.00

change model

see details

try it on

upload your own photo save the look

360 view see back

TRY-IT-ON sketch

Overall this improves the participatory and spatial aspects of the site. This app is framed in a small and convenient space so there is not much scrolling. Small screens will pop up with more options instead of opening whole new tabs. More expanding and shrinking. Users minds and creativity are at work as they create their favorite outfits and share them with others.

Page 6: Karmaloop Design Additions

TRY-IT-ON featureUsers have the option of picking a model and placing different apparel and accessories on those digital models. Models will vary in ethnicity and size. Users will also have the option of uploading pictures of themselves. This way they can see how the clothes will look on them.

They can do this in two ways 1. Upload a photo of yourself 2. Use a webcam that will take a picture of you and instantly upload it to the site. There will be a tutorial on how to effectively upload and/or take pics of yourself so it will be easy to try on various clothing.

Once you have created a look you can add the items to your cart, save the look to your dressing room wish list, or share your look via social networking (twitter, facebook, tumblr, and pintrest). To the left will be a list of the categories (women’s, men’s, apparel, accessories, etc.)

In the middle will be the actual model. You can zoom in/out and rotate the model to see different views. In the top left corner of the model box it will list what items you have on the model and the total price of the look.

To the right will be the pictures of the apparel and accessories.

One-click puts the item on the model. Two-clicks opens up a window with a large picture of the item, various views, colors, sizes, and reviews. From this window users can add the item to their wish list or shopping cart.

Page 7: Karmaloop Design Additions

KARMAWORLD sketchedit closet design share closet your account Your Closet

Page 8: Karmaloop Design Additions

KARMAWORLD is an online application that provides encyclo-pedic, spatial, and participatory aspects to Karmaloop. The app has several features.

1) It keeps track of all purchases made on the site.

2) It allows users to create and design a closet/room where they store digital replicas of items they have purchased.

3) Users can friend, interact, and message each other.

4) Users can request to borrow/share clothing with friends. The app is designed to work on a computer as well as a tablet.

KARMAWORLD sketch

Page 9: Karmaloop Design Additions

mobile application sketches

Page 10: Karmaloop Design Additions

mobile application sketches

The goal with these apps is to touch on the different areas of fashion and to create a new shopping experience by taking advan-tage of the functionality with mobile devices. In takes the website off the computer and brings it to the users “real” world. After creating 13 app ideas these are the two that stood out to me the most. They use the special features of mobile devices as well as promote karmaloop and their clothes.

Page 11: Karmaloop Design Additions

YOUR ACCOUNT

Hello, Lauren

WISH LI ST&

CARTKARM AWORLD

RECENTPURCHASES

Home page for users accounts. Logo takes users back to the main page. Wish list and Cart opens new window for future purchses and items currently in the cart. Recent Purchases opens a window where users can see recent purchases and check status of orders

Page 12: Karmaloop Design Additions

CREATE A

LOOK

YOURCLOSET

YOUR DESIGNS

MESSAGESYOUR CLOSET

FRIEND’S CLOSETS

SENT

reply

reply

reply

reply

COMPOSE

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Hey nice closet

Ne ed an out fi t

Closet Share R eq ues t

Clot hes Share Requ es t

INBOX

KarmaWorld Users account pageView and reply to messages • See Friends. Simply click the friend to view their closet•Choose between create - a -look, visit your closet, see your fashion designs

Page 13: Karmaloop Design Additions

The closet page. When users purchase clothing a digital form of the item goes into their personal closet. Users can keep track of items they have purchased and decorate a closet to store these items. Here users can rear-range and edit things in their closets. Users can share their closets with friends so they can see their items or new designs.

KARMAWORLD

TOPS BOTTOMS

SHOES ACCESSORIES

YOUR LOOKSOUTERWEAR

edit closet themes hare closety our account

YOUR CLOSET

Page 14: Karmaloop Design Additions

edit closet theme

SIMPLY SIMPLE

WOODEN CLASSIC

FRENCH TIP

MODERN FLARE

GEO-METROPRETTY IN PINK

PRIMETIME

TEEN DREAM

CLOSET THEMES

update themepreview

By clicking “edit closet theme” users can change the theme of their closet. They can get a quick preview of what it will look like and then chose it as their theme by clicking “update theme”.

Page 15: Karmaloop Design Additions

Clicking “Share Closet” allows users to choose how they want to share their closet design and the items in it. They can tell friends they have new clothes or need help putting together an outfit for an event.

EDIT THEME SHARE CLOSET MY ACCOUNT

KARMAWORLDfriends

By Email

Share your closet with your followers

Page 16: Karmaloop Design Additions

View&Share closet

TOPS

advancedsearch

MY ACCOUNT

Your Closet (friend’s view)This is what your friends see when they view your closet. They can see items that you have actively in view. If they like the item they can click to see its full page on karmaloop.com. In the closet area is where we have “friend sharing”. Friends can request to share or swap clothing with each other by clicking “request share” which sends an alert to the closet owner.

Page 17: Karmaloop Design Additions

View&Share closet

TOPS

advancedsearch

stylec olor size brand

tunics

blouse

sweater

t-shirts

MY ACCOUNT

Page 18: Karmaloop Design Additions

View&Share closet

AMY PRINTED BLOUSE

SMALL

VIEW SHIRT ON KARMALOOP.COM

ROTATE

REQUEST SHARE

MY ACCOUNT

Page 19: Karmaloop Design Additions

TRY-IT-ON APP

LAUREN’S LOOKS

MY ACCOUNT YOUR CLOSET TRY-IT-ON

black tee 12.98black shorts 24.99spiked heels 75.99

crop top 12.98skirt 24.99platform shoe 75.99fedora 13.99

black tank 12.98printed leggings 24.99sneakers 75.99fedora 13.99

This is the Your Designs page. Users can view outfits that you have put together. The bottom of each picture displays a breief decsription and the price. By clicking on the description it takes users to the product page on karmaloop.

Page 20: Karmaloop Design Additions

TRY-IT-ON APP

This is where users create the looks that they add to their design slideshows.

MEN WOMEN

CLOTHING

ACCESSORIES

NEW ARRIVALS

SALE

+Denim+Knit Tops+Outerwear

+Undergarmens

+Pants+Shirts+Shorts+Sweaters+Sweatshirts+T-Shirts+Tank Tops

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

try it on

see details

Total : 174.38

change model upload your own photos ave the look

360 view see back

CREATE YOUR LOOK

Page 21: Karmaloop Design Additions

TRY-IT-ON APP

MEN WOMEN

CLOTHING

ACCESSORIES

NEW ARRIVALS

SALE

+Denim+Knit Tops+Outerwear

+Undergarmens

+Pants+Shirts+Shorts+Sweaters+Sweatshirts+T-Shirts+Tank Tops

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

CREATE YOUR LOOK

UNIFThe Glam Jacket

$49.95

Faux fur coat with invisible snap-button closure; fully lined; 60% polyester, 40% acrylic.Our model Staz is 5'7" tall with a 32" bust, 25.5" waist, and 34" hips.By UNIF (Style # UWJ-3005-GRY)

Colors

Size

Quantity

XS S M L

1

add to cart add to wish listtry onLorem

Lorem

Leave a Review

Lorem

Lorem

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean bibendum libero vel tortor condimentum et porta dolor auctor. Nunc velit velit, dapibus id porttitor eu.

Clicking “get details” takes users to this page. Where you can see specs and reviews on an item. You can also add it to your own cart or wishlist.

Page 22: Karmaloop Design Additions

MEN WOMEN

CLOTHING

ACCESSORIES

NEW ARRIVALS

SALE

+Denim+Knit Tops+Outerwear

+Undergarmens

+Pants+Shirts+Shorts+Sweaters+Sweatshirts+T-Shirts+Tank Tops

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

CREATE YOUR LOOK

CHOOSE MODEL

TRY-IT-ON APP

When you click “choose new model” a slideshow of new models come up. Click on the face and the model chang-es in the dressing room.

Page 23: Karmaloop Design Additions

MULTIPLATFORM

MEN WOMEN

CLOTHING

ACCESSORIES

NEW ARRIVALS

SALE

+Denim+Knit Tops+Outerwear

+Undergarmens

+Pants+Shirts+Shorts+Sweaters+Sweatshirts+T-Shirts+Tank Tops

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

try it on

see details

Total : 174.38

change model upload your own photo save the look

360 view see back

MEN WOMEN

CLOTHING

ACCESSORIES

NEW ARRIVALS

SALE

+Denim+Knit Tops+Outerwear

+Undergarmens

+Pants+Shirts+Shorts+Sweaters+Sweatshirts+T-Shirts+Tank Tops

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

try it on

see details

Total : 174.38

change model upload your own photo save the look

360 view see back

Your Account

Hello, Lauren

Wish List & Cart

KarmaWorld

Recent Purchases

Page 24: Karmaloop Design Additions

5:30Thursday, December 15

Karmaloop truck has arrived at location

K

slide to unlock

TRAVELING BOUTIQUEUser gets a notification that a traveling boutique is in their area.

Page 25: Karmaloop Design Additions

TRAVELING BOUTIQUE

Unlocking phone opens the app and user can chose to see the Location, edit their settings or see the inventory on the truck. So select simply tap and drag in the direction of the arrows.K Traveling Boutique

Location

Inventory

Settings

Page 26: Karmaloop Design Additions

TRAVELING BOUTIQUE

Traveling BoutiqueLocationK Traveling Boutique Location

03:45:12

Once in location user can see where the truck is located via google maps. They can also get directions. The timer at the top lets users know how long the truck will be in that location.

Page 27: Karmaloop Design Additions

TRAVELING BOUTIQUE

Inventory shows users what items are on the truck. Tap an item to see more info

tops bottomss hoes accessoriesm ore

INVENTORYK

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

Jacket$45.89

K Traveling Boutique

Location

Inventory

Settings

Page 28: Karmaloop Design Additions

TRAVELING BOUTIQUE

tops bottoms shoes accessories more

INVENTORYK

Jacket$45.89

Jacket$45.89

Jacket$45.89

Two finger scroll to view more items.

Page 29: Karmaloop Design Additions

TRAVELING BOUTIQUE

Shake the phone to get a random mix of the inventory.

Page 30: Karmaloop Design Additions

TRAVELING BOUTIQUEpurchasing from the

Users go to Settings to edit location, payment information, and sizes. Only items available in your size will show up in your inventory unless you turn the size sorter off.

K Traveling Boutique

Location

Inventory

Settings

SAVE

K SETTINGS

Location

Quick Pay

Your SizesTops

Bottoms

Dress

Shoe

Add/Change Account and assign fingerprint

Baltimore, MD

*********5346

Small

26”

2

8

ON OFF

Page 31: Karmaloop Design Additions

TRAVELING BOUTIQUEpurchasing from the

Here users edit their payment info and assign their fingerprint to it. A screen appears, similar to the payment page, where you save your fingerprint scan.

Assign Fingerprint

K SETTINGS

Type

NameCard Number

CVC

Expiration Month

Visa

Year

Credit Card Checking Acct

Page 32: Karmaloop Design Additions

UNIFThe Glam Jacket

$49.95

see specifics only 10 left in your size

BACK

QUICK PAY & PICKUP

ADD TO CART

Colors

Quantity

Size

small

Users can see more item details and can as the item to their shopping cart.

TRAVELING BOUTIQUEpurchasing from the

Page 33: Karmaloop Design Additions

When done shopping users press quick pay to pay via fingerprint scanner. A fingerprint is linked to a credit card or checking account. To change the account just click the account button.To edit the cart and see a breakdown of the total simply click the total.

Confirmation page where users can save their receipt to their passbook for easy retrieval when they reach the truck.

TRAVELING BOUTIQUEpurchasing from the

QUICK PAY & PICKUPKTOTAL: 67.98

5...4...3...2...1

place left thumb and hold for 5 seconds

Account *********5346

K

Your Order Has Been Placed

Confirmation #23238475

Page 34: Karmaloop Design Additions

PIC-N-MATCH This app allows users too take pictures of clothes and find color or style matches for that item.

Page 35: Karmaloop Design Additions

PIC-N-MATCH

Pressing the camera button on the homep-age of the app acti-vates the phone’s cam-era. Users take a pic of clothing they see. They can zoom in our out with two fingers.

Once the pic is taken you see a preview. You approve the photo or trash it and take an-other one.

OFF OPTIONS HDR OFFO PTIONS HDR

Page 36: Karmaloop Design Additions

PIC-N-MATCH nce the pic is approved, users choose what item they are looking for.1) The same style. In this case a trench coat2) The same color. In this case a bright royal blue.3)Or an exact match

Page 37: Karmaloop Design Additions

PIC-N-MATCH Exact match will give users a list of all blue trench coats that Karmaloop sells. Style match will display all the trench coats that the site offers. Color match will send you to this page where users select what kind of item they are looking for.

Page 38: Karmaloop Design Additions

PIC-N-MATCH If the user clicks dresses, then all dresses with that shade of blue will appear. Use a two finger swipe to scroll through. When you find a dress you like, simply click on the picture and the app will take you to the product page for that item.