929260 - [UX] determine if separate UI is needed for China Marketplace

Status: RESOLVED WONTFIX

(Tracking :: User Story, defect)

Comment 1

[Caitlin Galimidi [:c8o]]

Attachment: images of competitive app stores in China

Comment 2

[Caitlin Galimidi [:c8o]]

From: JingZhang <[e-mail]>
Subject: Re: China Marketplace App
Date: October 21, 2013 2:02:55 AM PDT
To: Caitlin Galimidi <[e-mail]>
Cc: JingZhang <[e-mail]>, Jack Guo <[e-mail]>, Spinger Wang <[e-mail]>, dbialer Bialer <[e-mail]>, Tony Santos <[e-mail]>, 唐虹 Tang <[e-mail]>

Hi Caitlin and Tony,

Regarding the Marketplace App in China, the start page of it need to be customized to meet the requirements for both Chinese users and developers. 
 
In China, people are used to 'content-rich' user interface. 
I have attached some screenshots of the most popular Android App Stores in China. Since Google Play is blocked in China, those third-party App Stores are dominating China market. Basically all of them have a very rich content on the start page with different level of App promotion places and different types of App rankings information. The downloads of these recommended apps are extremely high. With those different level of promotion it can attract more developers as well.

From the experience we got from running Firefox China Edition start page, in China people are expecting more frequently changed pages, both contents and the page design, especially for these content-oriented webpages/apps. So we have to adjust it from time to time to meet this kind of market needs. 


Based on our global start page (marketplace.firefox.com), I will try to come out a high level of mockup to explain all these in detail.



Best Regards,
Jing

Comment 3

[Jing Zhang]

Attachment: UI-redesign-of-the-marketplace-in-China.png

Comment 4

[Jing Zhang]

Attachment: UI-redesign-of-marketplace-in-China (update)

Comment 5

[Jing Zhang]

In the UI redesign of the marketplace in China (attachment 823218 [details]), the main changes are:

1. Redesign the start page (see Figure.1)

1.1 Replace the title of 'All Categories' with 'Exploration'. 
Instead of going through every app in all categories, it will be more efficient for users to browse through high ranking apps and apps we recommended.

1.2 Add a promotion header, which is more attractive and can gain more clicks.

1.3 (a tiny modification) In the 'Featured Apps' part, add the category each app belongs to and remove its review.

1.4 Add a 'Featured Selections’. 
In this part, there're several groups of app selection, such as 'The necessary apps for new users', 'Well designed ToDo apps', and so on. 

1.5 Add one more tab ‘What’s Hot’, ahead of Popular and New in the ranking list.
Apps in this list will be popular but more timely. So it will keep the content fresh, and make users engaged and returning to the market frequently.


2. Add the page of all featured selections (see Figure.2)
It will be reached by clicking the ‘View All’ link in Featured Selections. It contains a list of featured selections, the layout and style is the same as the current All Featured Apps.


3. Add the pages of a specific app selection (see Figure.3)
It will be reached by clicking one app selection. It contains a list of apps in this selection. Its layout and style is the same as the current All Featured Apps.

Comment 6

[Jing Zhang]

oops... for the attachment 823236 [details]

(In reply to Jing Zhang from comment #5)
> In the UI redesign of the marketplace in China (attachment 823218 [details]
> [details]), the main changes are:
> 
> 1. Redesign the start page (see Figure.1)
> 
> 1.1 Replace the title of 'All Categories' with 'Exploration'. 
> Instead of going through every app in all categories, it will be more
> efficient for users to browse through high ranking apps and apps we
> recommended.
> 
> 1.2 Add a promotion header, which is more attractive and can gain more
> clicks.
> 
> 1.3 (a tiny modification) In the 'Featured Apps' part, add the category each
> app belongs to and remove its review.
> 
> 1.4 Add a 'Featured Selections’. 
> In this part, there're several groups of app selection, such as 'The
> necessary apps for new users', 'Well designed ToDo apps', and so on. 
> 
> 1.5 Add one more tab ‘What’s Hot’, ahead of Popular and New in the ranking
> list.
> Apps in this list will be popular but more timely. So it will keep the
> content fresh, and make users engaged and returning to the market frequently.
> 
> 
> 2. Add the page of all featured selections (see Figure.2)
> It will be reached by clicking the ‘View All’ link in Featured Selections.
> It contains a list of featured selections, the layout and style is the same
> as the current All Featured Apps.
> 
> 
> 3. Add the pages of a specific app selection (see Figure.3)
> It will be reached by clicking one app selection. It contains a list of apps
> in this selection. Its layout and style is the same as the current All
> Featured Apps.

Comment 7

[Wil Clouser [:clouserw]]

Thanks Jing.  CCing Tony for input.

Two options from here:

1) We incorporate all these changes into the generic UI

2) Fireplace is forked and these changes go on a branch

Comment 8

[Tony Santos [:tsmuse]]

Hi Jing, 

These modifications seem very well thought out. I'm curious if you've seen the changes we're currently in the process of making to the Marketplace that we're calling The Feed. We have a write up about the underlying design strategy here: https://blog.mozilla.org/ux/2013/08/firefox-marketplace-in-the-future-customized-app-store-experience/ and a video of it here: https://www.youtube.com/watch?v=SIFwQoyVrzc 

I'd love to hear your thoughts on how these changes would be received in China, or what modifications you think you might need to make to make the idea work in China (or if you think it will work at all.) If there is a way we can make The Feed concept work for China I think that would be the best China specific variant to build.

Comment 9

[Jing Zhang]

Hi Tony,

I’ve read the blog and watched the video. It’s awesome, especially in making user customization easier, more fun and engaging. I like it so much. 

However, the ‘customization’ does not work well in China:
1. Most of users prefer to take whatever we provide to them. For instance, add-ons are not well adopted for Firefox in China. Few users active to install add-ons.
2. There will be very few volunteers to contribute high quality content, such as app collections. Normally the content, especially in user’s homepage, is controlled and edited by us, not depending on UGC.


I like the new design of The Feed. May I have a set of mockups, such as the Collections page, Trending page and the individual app’s page.

I am thinking of "keep" the same UI design and apply it to China with different content. Does it make sense?

Comment 10

[Tony Santos [:tsmuse]]

We put together a prototype of the feed concept for the Mozilla Summit last month, you can play with it here: http://people.mozilla.org/~asantos/feedPrototypes/summit2013/feetPhase1/index.html (it's a swipe based interface, so you will have to click and drag to get the swipes to work on a desktop computer) 

In it's initial version, we will not be doing much user customization. We have an editor that will be building a feed for users, so the v1 of the feed may actually be a good fit for China is users are more interested in content provided to them by us instead of a more customized experience. I've also included a link to the editorial style guide we produced. These pngs show the different types of units we've designed for the initial version of the feed, and the rules for each unit's content.https://www.dropbox.com/sh/61x1rtem19ak11y/B1aXgMBqNk

Perhaps designing China specific units to display in the feed would be a good option? It would allow us to use a lot of the existing code for the global marketplace and it would allow us to potentially add things you and your team come up with back into the global marketplace as well.

Comment 11

[Jing Zhang]

Hi Tony, Thank you so much! 

Your suggestion sounds great. I've seen the existing units design. It's really flexible and it would be meet the needs of China market.

So, What's your implementation schedule for this UX design? And how does the editor build the feed, is there a CMS for administrator or something like that?

Thanks!

Comment 12

[Tony Santos [:tsmuse]]

Hi Jing,

The timeline for this to roll out is the end of the year, I believe, but that's more a question for Wil or Caitlin than me at this point. 

We have an editor tool that is not quite finished being designed yet, where our editor can create individual feed units and also build a the whole feed that users see. The current version of the tool that only deals with collections is up at: https://marketplace-dev.allizom.org/curation/ which gives you an idea of how the full feed building tool will work. I'm hoping the feed builder tool design will be finished in the next week or so, so I can share it when we have it in a state where it's a little more put together. 

What do you need from us, if anything, to get a China version of the feed going?

Comment 13

[Caitlin Galimidi [:c8o]]

Jing, 
We should have a target delivery date (handoff to QA) for feed in the next week. 

My recommendation is to have the eng / ux team review feed and the editor tools (called "curation tools") once we land the patch and handoff to QA for testing. 

I'd be very excited if this could work for the China team, as it means we won't have to support two completely separate UX. I love it that we can collaborate to include needs for the China consumer in our global marketplace solution.

Let me get the date when feed / curation tools will land and I'll get something on the calendar to review together. 

Caitlin

Comment 14

[Jing Zhang]

(In reply to Caitlin Galimidi from comment #13)
> Jing, 
> We should have a target delivery date (handoff to QA) for feed in the next
> week. 
> 
> My recommendation is to have the eng / ux team review feed and the editor
> tools (called "curation tools") once we land the patch and handoff to QA for
> testing. 
> 
> I'd be very excited if this could work for the China team, as it means we
> won't have to support two completely separate UX. I love it that we can
> collaborate to include needs for the China consumer in our global
> marketplace solution.
> 
> Let me get the date when feed / curation tools will land and I'll get
> something on the calendar to review together. 
> 
> Caitlin

Hi Caitlin,

That's great. Look forward to the feed and curation tools. Pls let me know when they're landing. Thanks!

Comment 15

[Caitlin Galimidi [:c8o]]

Target delivery for Feed V1 end Q1 (March)

Comment 16

[Wanting Xiong]

since no separate UI needed for China as concluded here, please help to localize Marketplace front-end interface. 
it's essential that display langague set to Chinese for China region. it also makes sense as currently apps showed are by user location.
Thanks!