SlideShare a Scribd company logo
1 of 18
Download to read offline
SCREEN LISTING
01. HOME
———
TOP NAVIGATION BAR
———
HAMBURGER MENU
02 HAMBURGER CAT
02.1 HAMBURGER SUBCAT1
03 SEARCH DASHBOARD
———
MAIN CONTENT
———
04 YOUR FEED
04.1 YOUR FEED - NO HISTORY
SELLER
05 ALL SHOPS
05.1 SELLER / PRODUCTS
05.2 SELLER / POSTS
BRAND
06 ALL BRANDS
06.1 BRAND / PRODUCTS
06.2 BRAND / STORES
CATEGORY
07 CATEGORY
07.1 CATEGORY DROPDOWN
07.2 CATEGORY TWO-COLUMN GRID
07.3 SUBCAT LEVEL 1
07.4 KOREAN BEAUTY
07.5 KOREAN WOMEN STYLE
07.6 KOREAN MEN STYLE
CONTAINER (CAMPAIGN)
08.1 CATALOG CONTAINER
08.2 STATIC CONTAINER
TPO
09.1 ALL TPOs
09.2 #TPO
10 NEW EVERYDAY
11 FLASH SALE
12 COUPON
———
MAIN CONTENT
———
BLOG
13 STYLE FEED
13.1 STYLE FEED TOPIC
13.2 STYLE FEED POST
PRODUCT DETAIL
14 PRODUCT DETAIL
———
BOTTOM NAVIGATION BAR
———
CHECKOUT FLOW
CART
SHIPPING INFO
PAYMENT METHOD
CHECK OUT
SUCCESS
PAYMENT FAILED
INBOX
19 NOTIFICATIONS
19.1 ORDER UPDATES
19.2 PROMOTION
19.3 TREND ALERT
CAN CHAT W SELLERS
20 MESSAGE DASHBOARD
20.1 MESSAGE DASHBOARD - NO CHAT HISTORY
20.2 MESSAGE DASHBOARD - SEARCH
20.3 CHOOSE A CONTACT
CANNOT CHAT W SELLERS
20.4 CHAT WITH LOTTEVN
20.5 TYPING MESSAGE
20.6 SEND MESSAGE
20.7 ATTACH ITEMS TO MES
20.8 SELECT ITEMS ATTACHED
20.9 SEND ITEMS ATTACHED
———
BOTTOM NAVIGATION BAR
———
PROFILE
21 PROFILE - YOUR LOVED ITEMS
21.1 PROFILE SCROLLING
21.2 PROFILE - NO LOVED ITEMS
21.3 PROFILE - YOUR ORDER
21.4 PROFILE - ORDER DETAIL
21.5 PROFILE - CANCEL ORDER
21.6 PROFILE - NO ORDER HISTORY
21.7 PROFILE SETTING
21.8. EDIT PROFILE
21.9 EDIT PROFILE FULL
21.10 EDIT PROFILE - CHANGE DATE
21.11 MY REVIEW
21.12 REVIEW FILTER
21.13 SHIPPING ADDRESS
21.14 LPOINT CREDIT
21.15 PREFERENCE
LOGIN
22. LOGIN
22.1 LOGIN - TEXT FILL
22.2 LOGIN - FACEBOOK
22.3 PASSWORD RECOVERY
22.4 PASSWORD RECOVERY - ERROR ALERT
22.5 PASSWORD RECOVERY - SUCCESS
SIGNUP
23 SIGNUP
23.1 SIGNUP - TEXT FILL
23.2 SIGNUP - FACEBOOK
23.3 SIGNUP - LPOINT
23.4 SIGNUP - LPOINT FULL
———
SELLER OFFICE
———
AAAAAA
01 - HOME
A
B
C
D
E
F
G
H
I J
K
L
HEADER freeze on top when scrolling down
OVERALL
· Structure layout by content block to easily remove or add new block
· Each block is scrollable by itself independently with others
· When a user stops scrolling, image in the row automatically align to
left
EXPLORE
· Navigation to other content screens
· Be able to remove, add, switch order, or change subcontent screen
in CMS (edit level of CMS)
Display effect: Carousel scroller - smooth drag horizontal scroll
HERO CAROUSEL
· Display maximum 10 banners
· Upload banner manually in CMS
· Define a landing screen for a banner in CMS
*Landing screen might be existing screen such as category; or new
created screen by uploading SKU list to a default container screen
such as campaign, catalog.
Display effect: Carousel showcase
· Enlarge banner when swiping left to right
· It stops at ONE next banner if swiping
Content: Sales-driven highlights only
· New arrivals direct buy
· Clearance Sale
· New brands coming
· Big event campaigns
TRENDING (TPO)
· Display maximum 10 TPOs
· Tap All > to screen 10 - ALL TPOs where collects all TPOs
· Display rule
1-4: Auto display by latest of TPO created date, however can manually pick for
1-2 in CMS
5-7: Auto display by highest views/ likes/ shares/follows
8-10: Auto display by highest searches
*This rule will be improved by time for better personalization.
Display effect: Carousel scroller - smooth drag horizontal scroll
Content:
A Hashtag, TPO name
B Number of views
NEW EVERYDAY (NEW ARRIVALS)
· Display maximum 10 banners
· Auto display by the latest create date of new collections
· Tap All → to screen 11 - NEW EVERYDAY where contains all new collections
· A new collection is created in CMS by
1.Create a landing screen (campaign, catalog) by uploading SKU list
Or using a category screen filtered new products
Or using a brand/seller screen filtered new products
2. Upload a banner
Display effect: Carousel scroller - smooth drag horizontal scroll
Content:
· New collections / arrivals
· New brands
· New sellers
DEALS FOR YOU (FLASH SALE)
· Display 10 active flash sale products
· Display in default product catalog layout
· 3 flash sale periods per day: 8am-12pm, 12-16pm, 16-23pm
At a given date, a flash sale product with its PROMOTION TIME from 12-16pm will be
ACTIVE from 12-16pm of this day
· Tap All → to screen 12 - FLASH SALE where contains all deals
Display effect: Carousel scroller - smooth drag horizontal scroll
TODAYS’ TIP (STYLE FEED)
· Display 10 blog articles from Style feed blog or videos from Youtube channel
· Auto display by the latest of publish date
· Tap All → to screen 13 - STYLE BLOG where contains all articles and videos
Display effect: Carousel scroller - smooth drag horizontal scroll
C Article Title
D
Article Category* display maximum 2 levels, ex. #LOOK #BEAUTYE
Article Publish Date
Article Intro
F
*Article Category
CAT
#LOOK
#HOMEY
#PLAY
#RADAR
SUBCAT
#FASHION, #BEAUTY
LOVE OR NOT (CROWDFUNDING)
· Display 10 crowdfunding products
· Auto display by the latest of create date
· Product displayed in video format or photo format
· Product has no.of votes out of target (100 votes of 100) will not be shown
in home, but in all crowdfunding screen
G Tap on to vote for prdt
H After a user votes, total votes is added up 1, the orange row
moves to right 1 unit
Display effect:
· If >1 product, carousel scroller - smooth drag horizontal scroll
· If 0 product, turn off this section
· If 1 product, show full-screen one product
MORE TO LOVE
· Infinity scrolling
· Newest products of all categories shown on top
· Show all products of all categories
I Filter and sorting, freezed when scrolling down
J Grid view switcher
· Appear when a new product is uploaded
· Tap on to scroll up to top of MORE TO LOVE section
K Slider to show other angle product photos
Tap ♡ to add a product to user favorite listL
M
M
01 - HOMECONTENT MAP
07.4 KOREAN BEAUTY
07.5 KOREAN WOMEN STYLE
07.6 KOREAN MEN STYLE
05 ALL SHOPS
12 COUPON
07 CATEGORY - LIVING
07 CATEGORY - MART
07 CATEGORY - MOM BABY
07 CATEGORY - TECH
06 ALL BRANDS
09.1 ALL TPOs
09.2 #TPO
10 NEW EVERYDAY
11 FLASH SALE
13 STYLE FEED
13.1 STYLE FEED TOPIC
13.2 STYLE FEED POST
04 YOUR FEED
CART
INBOX
PROFILE
02 - HAMBURGER
CAT
02.1 HAMBURGER
SUBCAT1
A
B
C
D
E
F
G
H
I
J
HAMBURGER
How to access?
· Hamburger menu icon on the top left from home
· Display effect: Appear LTR transition
How to close?
· “X” icon
· Overlay area
· Display effect: Disappear RTL transition
Content:
· Only show two level of category tree: CAT, SUBCAT1
· Tap to a SUBCAT1, it leads to category screen 15 - CATEGORY
· Tap to CAT all of SUBCAT1 under this CAT
will be shown in 02.1 - HAMBURGER SUBCAT1
A B C D E F G
H
I
J
#koreanstyle lands to screen 06 - KOREAN STYLE
#koreanbeauty lands to screen 05 - KOREAN BEAUTY
#stylefeed lands to screen 13 - STYLE BLOG
03.SEARCH
Access? From
Top bar
Small icon
Mainscreen
Yourfeed
Seller
Brand
Product detail
Cart
Inbox
Profile
Other catalog pages
Search Dashboard
Typing Previous screen
Search result
Access search again
Campaign page
Stylefeed
New Everyday
For You
None
Continue typing
04 - YOUR FEED
A
B
C D
E
F G
H
OVERALL
Your Feed is where a user sees new posts from following sellers, following
hashtag TPO or following style feed (news)
SALE POST FROM SELLER
· If a seller makes change on product price for 100 products in the same time,
a SALE post will be created automatically by grouping all 100 products in ONE post
· Display effect: Slider, swipe LTR for another product
A Seller Profile Photo + Seller Name
B “Sale” is automatically shown (reference app The Iconic)
C Post time
D Follow button. If tap on Following button, users will unfollow this seller
After unfollow, the seller post still remains on feed. It will be removed if user
bounce and re-visit the feed
E Current slide number
F Tap ♡ to add a product to user favorite list
G Share a product
NEW ARRIVALS POST FROM SELLER
· If a seller upload n products at a same given time,
a New arrivals post will be created automatically by: grouping all n products
in ONE post
H “New arrivals” is automatically shown (reference app The Iconic)
POST FROM TPO HASHTAG
· A new post will be created automatically if a new product is tagged to a
following TPO
· Create a TPO #KoreanStyle which collect all direct buy, cross border
fashion products
· Create a TPO #KoreanBeauty which collect all direct buy, cross border
beauty products
POST FROM STYLE FEED (BLOG)
· A new post will be created automatically if a new blog post is published
04.1 YOUR FEED
NO HISTORY
AA1
B
C
D
E
F
RECOMMENDED SELLERS
· Display maximum 10 sellers
· Auto display not-following-yet sellers based on following rules
1-3: 3 sellers of the latest viewed products
4-6: 3 highest-items-sold sellers in the same categories with 3 previous sellers
7-8: 2 sellers of the latest bought products
9-10: 2 highest-items-sold sellers in the same categories with 3 previous sellers
* No duplicate sellers
*This rule will be improved by time for better personalization.
· If no purchase history
1-3: 3 sellers of the latest viewed products
4-10: Highest-items-sold sellers in the same categories with 3 previous sellers
· If no view history & no purchase history
1-10: Highest-items-sold sellers of main categories: Women, Korean Female Style, Men, Korean Male Style,
Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby
A
A
A1 Seller profile photo
B Seller Name
C Total number of active products of a seller
D Follow button
E
B C D E will display info of this seller
4 latest products by upload time
Display effect
· Carousel scroller
· When seller is scrolled to position
· Tap to ALL , it leads to screen 07 - ALL SHOPS
RECOMMENDED TPO
· Display maximum 10 TPOs
· Tap All > to screen 10 - ALL TPOs
1: #KoreanStyle, which is a TPO collected all direct buy,
cross border fashion products
2: #KoreanBeauty, which is a TPO collected all direct buy,
cross border beauty products
3-4: Auto display by latest of TPO created date
5-7: Auto display by highest views/ likes/ shares/follows
8-10: Auto display by highest searches
*Rules above will be improved by time for better personalization.
RECOMMENDED STYLE FEED
· Display 10 blog articles from
STYLE FEED blog or videos
from Youtube channel
· Auto display by the latest of
publish date
F Follow button
05 - ALL SHOPS
OREAN MEN STYLE BEAUTY KOREAN BEAUTY LIVING MART TECH MOM&BABY
AA1
B
C
D
E
F
G
H
I
J
K
L
M
FEATURED SELLERS
· Display maximum 10 sellers
· Auto display not-following-yet sellers based on following rules
1-10: Highest-items-sold sellers of main categories: Women, Korean Women Style, Men, Korean Men Style,
Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby
· However, can also manually pick for in CMS
A A1 Seller profile photo
B Seller Name
C Total number of active products of a seller
D Follow button
E 4 latest products by upload time
B C D E will display info of this seller
Display effect
A
· Carousel scroller
· When a seller is scrolled to position
CATEGORY NAVIGATION
· Filter sellers by category
How to?
1- Based on product category that a seller is selling. Eg:
If a seller has 100 active products of category WOMEN and 50 active products of category BEAUTY
then this seller is listed in 2 categories: WOMEN, BEAUTY
OR
2- Create a selection list question that requires sellers to answer when register in SELLER OFFICE
Display effect
· Horizontal scrolling
· Tap to one category, the red underline will move tobe under that category; display only sellers which
belong to this category
F Total number of sellers in one category
SELLER BLOCK
· Display 5 best-seller products which have highest items sold
· Sellers listing in order following rules below
+ First, new sellers in the last 21days
+ Then, sellers have highest to lowest items sold
G Seller profile photo
H Seller Name
I Seller City
J Seller Description
How to?
1- Require sellers to write when register in SELLER OFFICE
OR
2- Based on product sub-category 1 that a seller is selling
Eg: Sneakers, Apparel, Jewelry & Watches
K Follow button
If a user doesn’t follow a seller yet, the button will be
If a user already follow a seller, the button will be
L 5 best-seller products which have highest items sold
Product Info: photo, brand, product name, price
M View more button with total number of active products, after 5 products
+Follow
Following
05.1 SELLER / PRODUCTS
A
B
C
D
E
F
G H
I J
K
L M
N
05.2 SELLER / POSTS
SEARCH
Search products of this seller only
SHARE
Tap on the button, a share screen as below appears
SELLER PROFILE
A
B
C
D
E
F
Seller profile photo
Seller Name
Seller City
Total number of followers
Total number of active products
Seller Description
How to?
1- Require sellers to write when register in SELLER OFFICE
OR
2- Based on product sub-category 1 that a seller is selling
Eg: Sneakers, Apparel, Jewelry & Watches
G Follow button
If a user doesn’t follow a seller yet, the button will be
If a user already follow a seller, the button will be
+Follow
Following
H Ask a question button to chat with sellers
NAVIGATION & FILTER
PRODUCT CATALOG
I Is a navigation tab, tap on to show all active products
Tap on to filter by sub category 1
Tap on to filter by brand
Sorting
See 1 & 2 in 04 - YOUR FEED for post details
Tap on to access 05.2 SELLER/ POSTSJ
K
L
M
See details in page 14 - Product catalog
Total number of active products
Change if a new filter option selected
Disappear if scrolling down
N
SELLER
06 - ALL BRANDS
OREAN MEN STYLE BEAUTY KOREAN BEAUTY LIVING MART TECH MOM&BABY
FEATURED BRANDS
· Display maximum 10 brands
· Auto display 10 highest-items-sold brands of 10 categories: Women, Korean Women Style, Men, Korean Men Style,
Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby
· However, can also manually pick for in CMS
A
Display effect
· Carousel scroller
· Carousel scroller
NEW BRANDS
· Display maximum 10 brands
· Auto display 10 newest brands by created date
Display effect
BRAND PROMOTION
· Display maximum 10 promotions
· Manually select 10 promotions in CMS as below
Brand logo
B Choose a brand, then brand logo will auto display
C
Fill a discount rate
Upload a photo
D
Fill a discount priceE
Brand logo or brand profile photoF
Brand nameG
SELLER BLOCK
· Display 5 best-seller products which have highest items sold
· Sellers listing in order following rules below
+ First, new sellers in the last 21days
+ Then, sellers have highest to lowest items sold
G Seller profile photo
H Seller Name
I Seller City
J Seller Description
How to?
1- Require sellers to write when register in SELLER OFFICE
OR
2- Based on product sub-category 1 that a seller is selling
Eg: Sneakers, Apparel, Jewelry & Watches
K Follow button
If a user doesn’t follow a seller yet, the button will be
If a user already follow a seller, the button will be
L 5 best-seller products which have highest items sold
Product Info: photo, brand, product name, price
M View more button with total number of active products, after 5 products
+Follow
Following
06.1 BRAND / PRODUCTS
06.2 BRAND / STORES
NAVIGATION
BRAND LIST
· Filter brands by category based on product category
Display effect
· Horizontal scrolling
· Tap to one category, the red underline will move tobe under that category;
show only brands which belong to this category
A
B
C
D
E
F
G
Tap on to show all products of brand
Show all sellers of a brand
A
A
Tap on to go to 06.2 BRAND / STORESB
B
PRODUCT CATALOG See details in page 14 - Product catalog
BRAND
07 - CATEGORY
E DECOR SALE
07.1 CATEGORY DROPDOWN 07.2 CATEGORY 2-COLUMN GRID07.3 SUBCAT LEVEL 1
07.4 KOREAN WOMEN STYLE 07.5 KOREAN MEN STYLE 07.5 KOREAN BEAUTY
· Display maximum 10 banners
· Upload banner manually in CMS
· Define a landing screen for a banner
in CMS. Landing screen might be existing screen
such as category; or new created screen by uploading
SKU list to a default container screen such as
campaign, catalog.
Display effect: Carousel showcase
· Enlarge banner when swiping left to right
· It stops at ONE next banner if swiping
Content: Sales-driven highlights only
· Trend (TPO)
· New arrivals
· Sales
· Campaign
CATEGORY SLIDER
SUBCAT 1 NAVIGATION
· Display all sub-cat 1 under each main category as list below
WOMEN STYLE
MEN STYLE
KOREAN WOMEN STYLE
KOREAN MEN STYLE
BEAUTY
KOREAN BEAUTY
TECH+
MART
MOM & BABY
LIVING
ALL CLOTHING SHOES ACCESSORIESNEW SALE
ALL CLOTHING SHOES ACCESSORIESNEW SALE
ALL CLOTHING SHOES ACCESSORIESNEW SALE
ALL CLOTHING SHOES ACCESSORIESNEW SALE
ALL MAKEUP SKIN CARE BATH & BODY CARE HAIR CARENEW FRAGRANCES BEAUTY TOOLS MEN FACE & BODY SALE
MAKEUP SKIN CARE BATH & BODY CARE HAIR CARE FRAGRANCES BEAUTY TOOLS SALEALL NEW
ALL KITCHEN BEDDING BATH FURNITURE DECORNEW SALE
ALL SMARTPHONE TABLET LAPTOP - PC TV & ENTERTAINMENTNEW CAMERA OFFICE SALE
ALL MILK BEVERAGE SNACK FRESH FOODNEW SPICES DETERGENT SALE
ALL MILK DIAPER BABY CARE KIDS CLOTHINGNEW PREGNANCY CARE SALE
FILTER
The no.of filter options will be decided based on which data we currently have
· By sub - category level 2 (subcat 2)
· By brand
· By size
· By color
· By price
· By material/fabric
· By occasion
· By shape
· By delivery
· By sale only
· By new only
SORTING
PRODUCT CATALOG
· By popularity, which can help you to add scores for product boosting
· By price low to high
· By price high to low
· By newest
A
A Total number of active products
· It will be changed if a new category selected or a new filter option selected
· Disappear if scrolling down
See further details in page 14 - Product catalog
CATEGORY
CONTAINER (CAMPAIGN)
08.1 - CATALOG 08.2 - STATIC (HTML EMBEDED) 08.2/A - CS INFO 08.2/B - CAMPAIGN
2 CONTAINER TYPES
- CATALOG CONTAINER: 08.1
- STATIC CONTAINER: 08.2
08.1 - CATALOG
· Use to create a campaign
08.2 - STATIC
· Use to create a content screen such as Customer Service Information
or Policy, etc., eg. 08.2/A - CS INFO
· Or to create a special campaign or games, eg. 08.2/B - CAMPAIGN
· There is a place holder (folder) to manage all container screens.
· To create a container screen, CMS must have following functions:
+ Input a screen name of the container screen
+ Options to choose to create CATALOG or STATIC screen
+ For CATALOG, there is a function to upload a product list
+ For STATIC, there is a function to embed a html content
IN CMS
TPO (STYLE SEARCH)
09.1 - ALL TPOS DROP DOWN 09.2 - TPO
· TPO is arranged into categories
· Choose another category; TRENDING NOW, TOP SEARCH, MORE TRENDS
will be changed to tailor to new category
CATEGORY DROPDOWN
· Display 15 TPOs by highest views/ likes/ shares/follows
Display effect: Carousel scroller - smooth drag horizontal scroll
TRENDING NOW
TOP SEARCH
· Display 15 TPOs by highest searches
Display effect: Carousel scroller - smooth drag horizontal scroll
Hashtag, TPO name
Number of views
MORE TRENDS
· Show all trends by the latest create date
· Infinity scrolling
TPO Banner
TPO Name or TPO Intro, Hashtag
Copy Text
Max. 4 products of TPO by manually choose in CMS
ON SALE
FLASH SALE
NEW EVERYDAY
10 - NEW EVERYDAY BRAND SCREEN FILTERED CATEGORY FILTERED CATALOG SCREEN
MART TECH MOM & BABY
Use a brand screen with a subcategory filtered
Use a category screen with a subcategory filtered
Create a new screen using a catalog container
A
B
C
A B C
HOW TO CREATE A NEW COLLECTION IN CMS?
Step 1: Create a landing screen (it might be or or )
Step 2: Input a collection name
Step 3: Choose a category for the collection
Step 4: Upload a banner for the collection
Step 5: Input the landing screen that you just created
CATEGORY
NEW COLLECTIONS LISTING
LANDING SCREEN MIGHT BE ONE OF 3 FOLLOWING
BRAND SCREEN FILTERED
A B C
· All collections are displayed and sorted by the latest create time
· A new collection is displayed as image below:
· All collections are displayed and sorted by the latest create time
· A new collection is displayed as image below:
Banner uploaded
Tap here to go to the landing screen
Collection name >> to the landing screen
Total no. of products in the landing screen, counted automatically
Auto display first 4 products in the landing screen
A
CATEGORY FILTEREDB
CATALOGC
NEXT DEALS SAVED DEALS HOW TO CREATE A FLASH SALE PRODUCT IN CMS?
ON SALE
NEXT DEALS
Step 1: Input a new discount price, discount start time, discount end time
Step 2: A flash sale product is defined if (end time - start time)<=7 days
· Display a time countdown End in 0:00:00 if a product ends its sale within 10 hours
· Display upcoming deals by the soonest start time
· Time countdown of deals starting within a next hour: Start in 00:00
· Time countdown of the rest deals: Start at start_time AM/PM
· Display saved deals by the soonest saved time
· 2 sections:
Top section for saved deals
which are on sale
Bottom section for saved deals
which have not started yet
Next Deals Saved Deals
SAVED DEALS
· If a flash sale ends, deactivate it on-site. There is no case as image below
Discount price
Original price . Discount rate
BRAND . Product Name
Items sold countdown
Time countdown
RESPONSIVE SCREENS
12 - COUPON 13 - STYLE FEED
Today Headlines
Beauty Inspiration
Fashion Style
Korean Style Channel
- Beauty articles from Lotteblog
- Fashion Style: fashion articles from Lotteblog
- Korean Style Channel: Lotte’s Youtube channel.
- Fashion articles from Lotteblog
- Lotte’s Youtube channel
- Highlight video/blog by manual pick
13.1 STYLE FEED TOPIC 13.2 STYLE FEED ARTICLE
RESPONSIVE FROM PC WEBSITE FOR
· 12 - COUPON
· 13 - STYLE FEED
· 13.1 - STYLE FEED TOPIC
· 13.2 - STYLE FEED ARTICLE
PRODUCT DETAIL
CHECKOUT FLOW - CART
CHECKOUT FLOW
INBOX
20 - MESSAGE
DASHBOARD
20.1 MESSAGE DASHBOARD
- NO CHAT HISTORY
20.2 SEARCH
MESSAGE 20.3 CHOOSE A CONTACT
20.4 CHAT W/ LOTTEVN 20.5 TYPING MESSAGE 20.6 SEND MESSAGE 20.7 ATTACH ITEMS TO MES 20.8 SELECT ITEMS ATTACHED
20.9 SEND ITEMS ATTACHED
19. NOTIFICATIONS
19.1 ORDER UPDATES
19.2 PROMOTION PUSH
PROFILE
21 - YOUR LOVED ITEMS
SCROLLING
21.2 NO LOVED ITEMS 21.3 YOUR ORDER
21.4 ORDER DETAIL
21.5 CANCEL ORDER
21.6 NO ORDER HISTORY 21.7 ACCOUNT SETTINGS
21.8 EDIT PROFILE 21.9 EDIT PROFILE FULL
21.10 EDIT PROFILE - CHANGE DATE
21.11 MY REVIEW
21.12 REVIEW FILTER
21.13 SHIPPING ADDRESS 21.14 LPOINT CREDIT 21.15 PREFERENCE
SIGN IN - SIGN UP

More Related Content

Similar to Mobile App Design

Create new product(s)
Create new product(s)Create new product(s)
Create new product(s)Paytm
 
A Visual Guide to Creating and Managing Dutch Auctions
A Visual Guide to Creating and Managing Dutch AuctionsA Visual Guide to Creating and Managing Dutch Auctions
A Visual Guide to Creating and Managing Dutch Auctionskervinmarketing
 
Learn about freebie offers
Learn about freebie offersLearn about freebie offers
Learn about freebie offersSellOnFlipkart
 
Up, cross and related products
Up, cross and related productsUp, cross and related products
Up, cross and related productsMagetips
 
Magento responsive 3 d printing website theme
Magento responsive 3 d printing website themeMagento responsive 3 d printing website theme
Magento responsive 3 d printing website themeEmilyPhan21291
 
Adyogi manual
Adyogi manualAdyogi manual
Adyogi manualAdYogi
 
PLA: Creating an Ad Campaign
PLA: Creating an Ad Campaign PLA: Creating an Ad Campaign
PLA: Creating an Ad Campaign SellOnFlipkart
 
I procurement user_training
I procurement user_trainingI procurement user_training
I procurement user_trainingHamdy Elbana
 
Product Listing (PDF) @ Amazon
Product Listing (PDF) @ AmazonProduct Listing (PDF) @ Amazon
Product Listing (PDF) @ Amazonebech0
 
Webinar - How To Drive Promotions To Your Magento eCommerce Store
Webinar - How To Drive Promotions To Your Magento eCommerce StoreWebinar - How To Drive Promotions To Your Magento eCommerce Store
Webinar - How To Drive Promotions To Your Magento eCommerce StoreeInfochips (An Arrow Company)
 
How to create sales &amp; e commerce pricelist promotions in odoo
How to create sales &amp; e commerce pricelist promotions in odooHow to create sales &amp; e commerce pricelist promotions in odoo
How to create sales &amp; e commerce pricelist promotions in odooPlanetOdoo
 
Selling online - Prepare your ecommerce project
Selling online - Prepare your ecommerce projectSelling online - Prepare your ecommerce project
Selling online - Prepare your ecommerce projectJohann Savalle
 
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...Anand Singh
 
How To Promote Product Catalog in Facebook Dynamic Ads
How To Promote Product Catalog in Facebook Dynamic AdsHow To Promote Product Catalog in Facebook Dynamic Ads
How To Promote Product Catalog in Facebook Dynamic AdsSoftProdigy Solutions
 
Amazon Marketing Services
Amazon Marketing ServicesAmazon Marketing Services
Amazon Marketing ServicesTinuiti
 
Create Your Own Promotion Page
Create Your Own Promotion PageCreate Your Own Promotion Page
Create Your Own Promotion Pageseller_zone
 
Magento Responsive Pillow & Blanket Printing Website Theme
Magento Responsive Pillow & Blanket Printing Website ThemeMagento Responsive Pillow & Blanket Printing Website Theme
Magento Responsive Pillow & Blanket Printing Website ThemeEmilyPhan21291
 
Facebook Power Editor: Everything You Need to Know
Facebook Power Editor: Everything You Need to KnowFacebook Power Editor: Everything You Need to Know
Facebook Power Editor: Everything You Need to KnowPCG Digital Marketing
 

Similar to Mobile App Design (20)

Create new product(s)
Create new product(s)Create new product(s)
Create new product(s)
 
My Promotion
My PromotionMy Promotion
My Promotion
 
A Visual Guide to Creating and Managing Dutch Auctions
A Visual Guide to Creating and Managing Dutch AuctionsA Visual Guide to Creating and Managing Dutch Auctions
A Visual Guide to Creating and Managing Dutch Auctions
 
Learn about freebie offers
Learn about freebie offersLearn about freebie offers
Learn about freebie offers
 
Up, cross and related products
Up, cross and related productsUp, cross and related products
Up, cross and related products
 
Magento responsive 3 d printing website theme
Magento responsive 3 d printing website themeMagento responsive 3 d printing website theme
Magento responsive 3 d printing website theme
 
Adyogi manual
Adyogi manualAdyogi manual
Adyogi manual
 
PLA: Creating an Ad Campaign
PLA: Creating an Ad Campaign PLA: Creating an Ad Campaign
PLA: Creating an Ad Campaign
 
I procurement user_training
I procurement user_trainingI procurement user_training
I procurement user_training
 
Product Listing (PDF) @ Amazon
Product Listing (PDF) @ AmazonProduct Listing (PDF) @ Amazon
Product Listing (PDF) @ Amazon
 
Webinar - How To Drive Promotions To Your Magento eCommerce Store
Webinar - How To Drive Promotions To Your Magento eCommerce StoreWebinar - How To Drive Promotions To Your Magento eCommerce Store
Webinar - How To Drive Promotions To Your Magento eCommerce Store
 
How to create sales &amp; e commerce pricelist promotions in odoo
How to create sales &amp; e commerce pricelist promotions in odooHow to create sales &amp; e commerce pricelist promotions in odoo
How to create sales &amp; e commerce pricelist promotions in odoo
 
Selling online - Prepare your ecommerce project
Selling online - Prepare your ecommerce projectSelling online - Prepare your ecommerce project
Selling online - Prepare your ecommerce project
 
Amazan FBA
Amazan FBAAmazan FBA
Amazan FBA
 
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...
Mastering the Amazon Brand Store: Your Complete Guide from A to Z for Brand B...
 
How To Promote Product Catalog in Facebook Dynamic Ads
How To Promote Product Catalog in Facebook Dynamic AdsHow To Promote Product Catalog in Facebook Dynamic Ads
How To Promote Product Catalog in Facebook Dynamic Ads
 
Amazon Marketing Services
Amazon Marketing ServicesAmazon Marketing Services
Amazon Marketing Services
 
Create Your Own Promotion Page
Create Your Own Promotion PageCreate Your Own Promotion Page
Create Your Own Promotion Page
 
Magento Responsive Pillow & Blanket Printing Website Theme
Magento Responsive Pillow & Blanket Printing Website ThemeMagento Responsive Pillow & Blanket Printing Website Theme
Magento Responsive Pillow & Blanket Printing Website Theme
 
Facebook Power Editor: Everything You Need to Know
Facebook Power Editor: Everything You Need to KnowFacebook Power Editor: Everything You Need to Know
Facebook Power Editor: Everything You Need to Know
 

Mobile App Design

  • 1. SCREEN LISTING 01. HOME ——— TOP NAVIGATION BAR ——— HAMBURGER MENU 02 HAMBURGER CAT 02.1 HAMBURGER SUBCAT1 03 SEARCH DASHBOARD ——— MAIN CONTENT ——— 04 YOUR FEED 04.1 YOUR FEED - NO HISTORY SELLER 05 ALL SHOPS 05.1 SELLER / PRODUCTS 05.2 SELLER / POSTS BRAND 06 ALL BRANDS 06.1 BRAND / PRODUCTS 06.2 BRAND / STORES CATEGORY 07 CATEGORY 07.1 CATEGORY DROPDOWN 07.2 CATEGORY TWO-COLUMN GRID 07.3 SUBCAT LEVEL 1 07.4 KOREAN BEAUTY 07.5 KOREAN WOMEN STYLE 07.6 KOREAN MEN STYLE CONTAINER (CAMPAIGN) 08.1 CATALOG CONTAINER 08.2 STATIC CONTAINER TPO 09.1 ALL TPOs 09.2 #TPO 10 NEW EVERYDAY 11 FLASH SALE 12 COUPON ——— MAIN CONTENT ——— BLOG 13 STYLE FEED 13.1 STYLE FEED TOPIC 13.2 STYLE FEED POST PRODUCT DETAIL 14 PRODUCT DETAIL ——— BOTTOM NAVIGATION BAR ——— CHECKOUT FLOW CART SHIPPING INFO PAYMENT METHOD CHECK OUT SUCCESS PAYMENT FAILED INBOX 19 NOTIFICATIONS 19.1 ORDER UPDATES 19.2 PROMOTION 19.3 TREND ALERT CAN CHAT W SELLERS 20 MESSAGE DASHBOARD 20.1 MESSAGE DASHBOARD - NO CHAT HISTORY 20.2 MESSAGE DASHBOARD - SEARCH 20.3 CHOOSE A CONTACT CANNOT CHAT W SELLERS 20.4 CHAT WITH LOTTEVN 20.5 TYPING MESSAGE 20.6 SEND MESSAGE 20.7 ATTACH ITEMS TO MES 20.8 SELECT ITEMS ATTACHED 20.9 SEND ITEMS ATTACHED ——— BOTTOM NAVIGATION BAR ——— PROFILE 21 PROFILE - YOUR LOVED ITEMS 21.1 PROFILE SCROLLING 21.2 PROFILE - NO LOVED ITEMS 21.3 PROFILE - YOUR ORDER 21.4 PROFILE - ORDER DETAIL 21.5 PROFILE - CANCEL ORDER 21.6 PROFILE - NO ORDER HISTORY 21.7 PROFILE SETTING 21.8. EDIT PROFILE 21.9 EDIT PROFILE FULL 21.10 EDIT PROFILE - CHANGE DATE 21.11 MY REVIEW 21.12 REVIEW FILTER 21.13 SHIPPING ADDRESS 21.14 LPOINT CREDIT 21.15 PREFERENCE LOGIN 22. LOGIN 22.1 LOGIN - TEXT FILL 22.2 LOGIN - FACEBOOK 22.3 PASSWORD RECOVERY 22.4 PASSWORD RECOVERY - ERROR ALERT 22.5 PASSWORD RECOVERY - SUCCESS SIGNUP 23 SIGNUP 23.1 SIGNUP - TEXT FILL 23.2 SIGNUP - FACEBOOK 23.3 SIGNUP - LPOINT 23.4 SIGNUP - LPOINT FULL ——— SELLER OFFICE ——— AAAAAA
  • 2. 01 - HOME A B C D E F G H I J K L HEADER freeze on top when scrolling down OVERALL · Structure layout by content block to easily remove or add new block · Each block is scrollable by itself independently with others · When a user stops scrolling, image in the row automatically align to left EXPLORE · Navigation to other content screens · Be able to remove, add, switch order, or change subcontent screen in CMS (edit level of CMS) Display effect: Carousel scroller - smooth drag horizontal scroll HERO CAROUSEL · Display maximum 10 banners · Upload banner manually in CMS · Define a landing screen for a banner in CMS *Landing screen might be existing screen such as category; or new created screen by uploading SKU list to a default container screen such as campaign, catalog. Display effect: Carousel showcase · Enlarge banner when swiping left to right · It stops at ONE next banner if swiping Content: Sales-driven highlights only · New arrivals direct buy · Clearance Sale · New brands coming · Big event campaigns TRENDING (TPO) · Display maximum 10 TPOs · Tap All > to screen 10 - ALL TPOs where collects all TPOs · Display rule 1-4: Auto display by latest of TPO created date, however can manually pick for 1-2 in CMS 5-7: Auto display by highest views/ likes/ shares/follows 8-10: Auto display by highest searches *This rule will be improved by time for better personalization. Display effect: Carousel scroller - smooth drag horizontal scroll Content: A Hashtag, TPO name B Number of views NEW EVERYDAY (NEW ARRIVALS) · Display maximum 10 banners · Auto display by the latest create date of new collections · Tap All → to screen 11 - NEW EVERYDAY where contains all new collections · A new collection is created in CMS by 1.Create a landing screen (campaign, catalog) by uploading SKU list Or using a category screen filtered new products Or using a brand/seller screen filtered new products 2. Upload a banner Display effect: Carousel scroller - smooth drag horizontal scroll Content: · New collections / arrivals · New brands · New sellers DEALS FOR YOU (FLASH SALE) · Display 10 active flash sale products · Display in default product catalog layout · 3 flash sale periods per day: 8am-12pm, 12-16pm, 16-23pm At a given date, a flash sale product with its PROMOTION TIME from 12-16pm will be ACTIVE from 12-16pm of this day · Tap All → to screen 12 - FLASH SALE where contains all deals Display effect: Carousel scroller - smooth drag horizontal scroll TODAYS’ TIP (STYLE FEED) · Display 10 blog articles from Style feed blog or videos from Youtube channel · Auto display by the latest of publish date · Tap All → to screen 13 - STYLE BLOG where contains all articles and videos Display effect: Carousel scroller - smooth drag horizontal scroll C Article Title D Article Category* display maximum 2 levels, ex. #LOOK #BEAUTYE Article Publish Date Article Intro F *Article Category CAT #LOOK #HOMEY #PLAY #RADAR SUBCAT #FASHION, #BEAUTY LOVE OR NOT (CROWDFUNDING) · Display 10 crowdfunding products · Auto display by the latest of create date · Product displayed in video format or photo format · Product has no.of votes out of target (100 votes of 100) will not be shown in home, but in all crowdfunding screen G Tap on to vote for prdt H After a user votes, total votes is added up 1, the orange row moves to right 1 unit Display effect: · If >1 product, carousel scroller - smooth drag horizontal scroll · If 0 product, turn off this section · If 1 product, show full-screen one product MORE TO LOVE · Infinity scrolling · Newest products of all categories shown on top · Show all products of all categories I Filter and sorting, freezed when scrolling down J Grid view switcher · Appear when a new product is uploaded · Tap on to scroll up to top of MORE TO LOVE section K Slider to show other angle product photos Tap ♡ to add a product to user favorite listL M M
  • 3. 01 - HOMECONTENT MAP 07.4 KOREAN BEAUTY 07.5 KOREAN WOMEN STYLE 07.6 KOREAN MEN STYLE 05 ALL SHOPS 12 COUPON 07 CATEGORY - LIVING 07 CATEGORY - MART 07 CATEGORY - MOM BABY 07 CATEGORY - TECH 06 ALL BRANDS 09.1 ALL TPOs 09.2 #TPO 10 NEW EVERYDAY 11 FLASH SALE 13 STYLE FEED 13.1 STYLE FEED TOPIC 13.2 STYLE FEED POST 04 YOUR FEED CART INBOX PROFILE
  • 4. 02 - HAMBURGER CAT 02.1 HAMBURGER SUBCAT1 A B C D E F G H I J HAMBURGER How to access? · Hamburger menu icon on the top left from home · Display effect: Appear LTR transition How to close? · “X” icon · Overlay area · Display effect: Disappear RTL transition Content: · Only show two level of category tree: CAT, SUBCAT1 · Tap to a SUBCAT1, it leads to category screen 15 - CATEGORY · Tap to CAT all of SUBCAT1 under this CAT will be shown in 02.1 - HAMBURGER SUBCAT1 A B C D E F G H I J #koreanstyle lands to screen 06 - KOREAN STYLE #koreanbeauty lands to screen 05 - KOREAN BEAUTY #stylefeed lands to screen 13 - STYLE BLOG 03.SEARCH Access? From Top bar Small icon Mainscreen Yourfeed Seller Brand Product detail Cart Inbox Profile Other catalog pages Search Dashboard Typing Previous screen Search result Access search again Campaign page Stylefeed New Everyday For You None Continue typing
  • 5. 04 - YOUR FEED A B C D E F G H OVERALL Your Feed is where a user sees new posts from following sellers, following hashtag TPO or following style feed (news) SALE POST FROM SELLER · If a seller makes change on product price for 100 products in the same time, a SALE post will be created automatically by grouping all 100 products in ONE post · Display effect: Slider, swipe LTR for another product A Seller Profile Photo + Seller Name B “Sale” is automatically shown (reference app The Iconic) C Post time D Follow button. If tap on Following button, users will unfollow this seller After unfollow, the seller post still remains on feed. It will be removed if user bounce and re-visit the feed E Current slide number F Tap ♡ to add a product to user favorite list G Share a product NEW ARRIVALS POST FROM SELLER · If a seller upload n products at a same given time, a New arrivals post will be created automatically by: grouping all n products in ONE post H “New arrivals” is automatically shown (reference app The Iconic) POST FROM TPO HASHTAG · A new post will be created automatically if a new product is tagged to a following TPO · Create a TPO #KoreanStyle which collect all direct buy, cross border fashion products · Create a TPO #KoreanBeauty which collect all direct buy, cross border beauty products POST FROM STYLE FEED (BLOG) · A new post will be created automatically if a new blog post is published 04.1 YOUR FEED NO HISTORY AA1 B C D E F RECOMMENDED SELLERS · Display maximum 10 sellers · Auto display not-following-yet sellers based on following rules 1-3: 3 sellers of the latest viewed products 4-6: 3 highest-items-sold sellers in the same categories with 3 previous sellers 7-8: 2 sellers of the latest bought products 9-10: 2 highest-items-sold sellers in the same categories with 3 previous sellers * No duplicate sellers *This rule will be improved by time for better personalization. · If no purchase history 1-3: 3 sellers of the latest viewed products 4-10: Highest-items-sold sellers in the same categories with 3 previous sellers · If no view history & no purchase history 1-10: Highest-items-sold sellers of main categories: Women, Korean Female Style, Men, Korean Male Style, Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby A A A1 Seller profile photo B Seller Name C Total number of active products of a seller D Follow button E B C D E will display info of this seller 4 latest products by upload time Display effect · Carousel scroller · When seller is scrolled to position · Tap to ALL , it leads to screen 07 - ALL SHOPS RECOMMENDED TPO · Display maximum 10 TPOs · Tap All > to screen 10 - ALL TPOs 1: #KoreanStyle, which is a TPO collected all direct buy, cross border fashion products 2: #KoreanBeauty, which is a TPO collected all direct buy, cross border beauty products 3-4: Auto display by latest of TPO created date 5-7: Auto display by highest views/ likes/ shares/follows 8-10: Auto display by highest searches *Rules above will be improved by time for better personalization. RECOMMENDED STYLE FEED · Display 10 blog articles from STYLE FEED blog or videos from Youtube channel · Auto display by the latest of publish date F Follow button
  • 6. 05 - ALL SHOPS OREAN MEN STYLE BEAUTY KOREAN BEAUTY LIVING MART TECH MOM&BABY AA1 B C D E F G H I J K L M FEATURED SELLERS · Display maximum 10 sellers · Auto display not-following-yet sellers based on following rules 1-10: Highest-items-sold sellers of main categories: Women, Korean Women Style, Men, Korean Men Style, Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby · However, can also manually pick for in CMS A A1 Seller profile photo B Seller Name C Total number of active products of a seller D Follow button E 4 latest products by upload time B C D E will display info of this seller Display effect A · Carousel scroller · When a seller is scrolled to position CATEGORY NAVIGATION · Filter sellers by category How to? 1- Based on product category that a seller is selling. Eg: If a seller has 100 active products of category WOMEN and 50 active products of category BEAUTY then this seller is listed in 2 categories: WOMEN, BEAUTY OR 2- Create a selection list question that requires sellers to answer when register in SELLER OFFICE Display effect · Horizontal scrolling · Tap to one category, the red underline will move tobe under that category; display only sellers which belong to this category F Total number of sellers in one category SELLER BLOCK · Display 5 best-seller products which have highest items sold · Sellers listing in order following rules below + First, new sellers in the last 21days + Then, sellers have highest to lowest items sold G Seller profile photo H Seller Name I Seller City J Seller Description How to? 1- Require sellers to write when register in SELLER OFFICE OR 2- Based on product sub-category 1 that a seller is selling Eg: Sneakers, Apparel, Jewelry & Watches K Follow button If a user doesn’t follow a seller yet, the button will be If a user already follow a seller, the button will be L 5 best-seller products which have highest items sold Product Info: photo, brand, product name, price M View more button with total number of active products, after 5 products +Follow Following 05.1 SELLER / PRODUCTS A B C D E F G H I J K L M N 05.2 SELLER / POSTS SEARCH Search products of this seller only SHARE Tap on the button, a share screen as below appears SELLER PROFILE A B C D E F Seller profile photo Seller Name Seller City Total number of followers Total number of active products Seller Description How to? 1- Require sellers to write when register in SELLER OFFICE OR 2- Based on product sub-category 1 that a seller is selling Eg: Sneakers, Apparel, Jewelry & Watches G Follow button If a user doesn’t follow a seller yet, the button will be If a user already follow a seller, the button will be +Follow Following H Ask a question button to chat with sellers NAVIGATION & FILTER PRODUCT CATALOG I Is a navigation tab, tap on to show all active products Tap on to filter by sub category 1 Tap on to filter by brand Sorting See 1 & 2 in 04 - YOUR FEED for post details Tap on to access 05.2 SELLER/ POSTSJ K L M See details in page 14 - Product catalog Total number of active products Change if a new filter option selected Disappear if scrolling down N SELLER
  • 7. 06 - ALL BRANDS OREAN MEN STYLE BEAUTY KOREAN BEAUTY LIVING MART TECH MOM&BABY FEATURED BRANDS · Display maximum 10 brands · Auto display 10 highest-items-sold brands of 10 categories: Women, Korean Women Style, Men, Korean Men Style, Beauty, Korean Beauty, Living, Mart, Tech+, Mom&Baby · However, can also manually pick for in CMS A Display effect · Carousel scroller · Carousel scroller NEW BRANDS · Display maximum 10 brands · Auto display 10 newest brands by created date Display effect BRAND PROMOTION · Display maximum 10 promotions · Manually select 10 promotions in CMS as below Brand logo B Choose a brand, then brand logo will auto display C Fill a discount rate Upload a photo D Fill a discount priceE Brand logo or brand profile photoF Brand nameG SELLER BLOCK · Display 5 best-seller products which have highest items sold · Sellers listing in order following rules below + First, new sellers in the last 21days + Then, sellers have highest to lowest items sold G Seller profile photo H Seller Name I Seller City J Seller Description How to? 1- Require sellers to write when register in SELLER OFFICE OR 2- Based on product sub-category 1 that a seller is selling Eg: Sneakers, Apparel, Jewelry & Watches K Follow button If a user doesn’t follow a seller yet, the button will be If a user already follow a seller, the button will be L 5 best-seller products which have highest items sold Product Info: photo, brand, product name, price M View more button with total number of active products, after 5 products +Follow Following 06.1 BRAND / PRODUCTS 06.2 BRAND / STORES NAVIGATION BRAND LIST · Filter brands by category based on product category Display effect · Horizontal scrolling · Tap to one category, the red underline will move tobe under that category; show only brands which belong to this category A B C D E F G Tap on to show all products of brand Show all sellers of a brand A A Tap on to go to 06.2 BRAND / STORESB B PRODUCT CATALOG See details in page 14 - Product catalog BRAND
  • 8. 07 - CATEGORY E DECOR SALE 07.1 CATEGORY DROPDOWN 07.2 CATEGORY 2-COLUMN GRID07.3 SUBCAT LEVEL 1 07.4 KOREAN WOMEN STYLE 07.5 KOREAN MEN STYLE 07.5 KOREAN BEAUTY · Display maximum 10 banners · Upload banner manually in CMS · Define a landing screen for a banner in CMS. Landing screen might be existing screen such as category; or new created screen by uploading SKU list to a default container screen such as campaign, catalog. Display effect: Carousel showcase · Enlarge banner when swiping left to right · It stops at ONE next banner if swiping Content: Sales-driven highlights only · Trend (TPO) · New arrivals · Sales · Campaign CATEGORY SLIDER SUBCAT 1 NAVIGATION · Display all sub-cat 1 under each main category as list below WOMEN STYLE MEN STYLE KOREAN WOMEN STYLE KOREAN MEN STYLE BEAUTY KOREAN BEAUTY TECH+ MART MOM & BABY LIVING ALL CLOTHING SHOES ACCESSORIESNEW SALE ALL CLOTHING SHOES ACCESSORIESNEW SALE ALL CLOTHING SHOES ACCESSORIESNEW SALE ALL CLOTHING SHOES ACCESSORIESNEW SALE ALL MAKEUP SKIN CARE BATH & BODY CARE HAIR CARENEW FRAGRANCES BEAUTY TOOLS MEN FACE & BODY SALE MAKEUP SKIN CARE BATH & BODY CARE HAIR CARE FRAGRANCES BEAUTY TOOLS SALEALL NEW ALL KITCHEN BEDDING BATH FURNITURE DECORNEW SALE ALL SMARTPHONE TABLET LAPTOP - PC TV & ENTERTAINMENTNEW CAMERA OFFICE SALE ALL MILK BEVERAGE SNACK FRESH FOODNEW SPICES DETERGENT SALE ALL MILK DIAPER BABY CARE KIDS CLOTHINGNEW PREGNANCY CARE SALE FILTER The no.of filter options will be decided based on which data we currently have · By sub - category level 2 (subcat 2) · By brand · By size · By color · By price · By material/fabric · By occasion · By shape · By delivery · By sale only · By new only SORTING PRODUCT CATALOG · By popularity, which can help you to add scores for product boosting · By price low to high · By price high to low · By newest A A Total number of active products · It will be changed if a new category selected or a new filter option selected · Disappear if scrolling down See further details in page 14 - Product catalog CATEGORY
  • 9. CONTAINER (CAMPAIGN) 08.1 - CATALOG 08.2 - STATIC (HTML EMBEDED) 08.2/A - CS INFO 08.2/B - CAMPAIGN 2 CONTAINER TYPES - CATALOG CONTAINER: 08.1 - STATIC CONTAINER: 08.2 08.1 - CATALOG · Use to create a campaign 08.2 - STATIC · Use to create a content screen such as Customer Service Information or Policy, etc., eg. 08.2/A - CS INFO · Or to create a special campaign or games, eg. 08.2/B - CAMPAIGN · There is a place holder (folder) to manage all container screens. · To create a container screen, CMS must have following functions: + Input a screen name of the container screen + Options to choose to create CATALOG or STATIC screen + For CATALOG, there is a function to upload a product list + For STATIC, there is a function to embed a html content IN CMS
  • 10. TPO (STYLE SEARCH) 09.1 - ALL TPOS DROP DOWN 09.2 - TPO · TPO is arranged into categories · Choose another category; TRENDING NOW, TOP SEARCH, MORE TRENDS will be changed to tailor to new category CATEGORY DROPDOWN · Display 15 TPOs by highest views/ likes/ shares/follows Display effect: Carousel scroller - smooth drag horizontal scroll TRENDING NOW TOP SEARCH · Display 15 TPOs by highest searches Display effect: Carousel scroller - smooth drag horizontal scroll Hashtag, TPO name Number of views MORE TRENDS · Show all trends by the latest create date · Infinity scrolling TPO Banner TPO Name or TPO Intro, Hashtag Copy Text Max. 4 products of TPO by manually choose in CMS
  • 11. ON SALE FLASH SALE NEW EVERYDAY 10 - NEW EVERYDAY BRAND SCREEN FILTERED CATEGORY FILTERED CATALOG SCREEN MART TECH MOM & BABY Use a brand screen with a subcategory filtered Use a category screen with a subcategory filtered Create a new screen using a catalog container A B C A B C HOW TO CREATE A NEW COLLECTION IN CMS? Step 1: Create a landing screen (it might be or or ) Step 2: Input a collection name Step 3: Choose a category for the collection Step 4: Upload a banner for the collection Step 5: Input the landing screen that you just created CATEGORY NEW COLLECTIONS LISTING LANDING SCREEN MIGHT BE ONE OF 3 FOLLOWING BRAND SCREEN FILTERED A B C · All collections are displayed and sorted by the latest create time · A new collection is displayed as image below: · All collections are displayed and sorted by the latest create time · A new collection is displayed as image below: Banner uploaded Tap here to go to the landing screen Collection name >> to the landing screen Total no. of products in the landing screen, counted automatically Auto display first 4 products in the landing screen A CATEGORY FILTEREDB CATALOGC NEXT DEALS SAVED DEALS HOW TO CREATE A FLASH SALE PRODUCT IN CMS? ON SALE NEXT DEALS Step 1: Input a new discount price, discount start time, discount end time Step 2: A flash sale product is defined if (end time - start time)<=7 days · Display a time countdown End in 0:00:00 if a product ends its sale within 10 hours · Display upcoming deals by the soonest start time · Time countdown of deals starting within a next hour: Start in 00:00 · Time countdown of the rest deals: Start at start_time AM/PM · Display saved deals by the soonest saved time · 2 sections: Top section for saved deals which are on sale Bottom section for saved deals which have not started yet Next Deals Saved Deals SAVED DEALS · If a flash sale ends, deactivate it on-site. There is no case as image below Discount price Original price . Discount rate BRAND . Product Name Items sold countdown Time countdown
  • 12. RESPONSIVE SCREENS 12 - COUPON 13 - STYLE FEED Today Headlines Beauty Inspiration Fashion Style Korean Style Channel - Beauty articles from Lotteblog - Fashion Style: fashion articles from Lotteblog - Korean Style Channel: Lotte’s Youtube channel. - Fashion articles from Lotteblog - Lotte’s Youtube channel - Highlight video/blog by manual pick 13.1 STYLE FEED TOPIC 13.2 STYLE FEED ARTICLE RESPONSIVE FROM PC WEBSITE FOR · 12 - COUPON · 13 - STYLE FEED · 13.1 - STYLE FEED TOPIC · 13.2 - STYLE FEED ARTICLE
  • 16. INBOX 20 - MESSAGE DASHBOARD 20.1 MESSAGE DASHBOARD - NO CHAT HISTORY 20.2 SEARCH MESSAGE 20.3 CHOOSE A CONTACT 20.4 CHAT W/ LOTTEVN 20.5 TYPING MESSAGE 20.6 SEND MESSAGE 20.7 ATTACH ITEMS TO MES 20.8 SELECT ITEMS ATTACHED 20.9 SEND ITEMS ATTACHED 19. NOTIFICATIONS 19.1 ORDER UPDATES 19.2 PROMOTION PUSH
  • 17. PROFILE 21 - YOUR LOVED ITEMS SCROLLING 21.2 NO LOVED ITEMS 21.3 YOUR ORDER 21.4 ORDER DETAIL 21.5 CANCEL ORDER 21.6 NO ORDER HISTORY 21.7 ACCOUNT SETTINGS 21.8 EDIT PROFILE 21.9 EDIT PROFILE FULL 21.10 EDIT PROFILE - CHANGE DATE 21.11 MY REVIEW 21.12 REVIEW FILTER 21.13 SHIPPING ADDRESS 21.14 LPOINT CREDIT 21.15 PREFERENCE
  • 18. SIGN IN - SIGN UP