E-commerce

M&G stationery

B2B App Overseas Version Design
Livestream Function

This project is for M&G Stationery, a well-known Chinese stationery brand.
They already have an app called M&G Alliance, which helps franchise stores in China discover products and place orders.
When the company expanded to Australia, they asked me to redesign the app for the Australian market, rather than simply translating the existing Chinese version.

Year :

2025

Industry :

E-commerce

Company:

M&G stationery

Project Duration :

12 weeks

My Role:

I was the UI/UX Designer for the livestream feature in the overseas version of the app.
My work covered user research, problem definition, journey mapping, user flows, and low-fidelity wireframes for the livestream experience.

The Challenge:

One of the biggest challenges was the livestream stock-selection feature.
Livestream commerce is extremely mature in China, but in Australia it is still new and not widely adopted.
This raised two key questions:

  • Should we keep the livestream feature at all?

  • If we keep it, how should we adapt it for Australian shop owners?

Research & Insight:

Before designing the UI & UX for the overseas app, I looked at who the users were in each market. In China, the primary users are franchisees and distribution store owners. The Australian users would have a similar role, but their shopping habits, expectations, and local logistics are very different.
Because of these differences in consumer behaviour and operational efficiency, we couldn’t simply copy the Chinese market logic and apply it to Australia.

Analysis: Livestreaming E-commerce

In the Chinese version of the M&G app, livestreaming is a key feature on the homepage. It is designed to help franchisees discover products that can generate profit.

From my market research, I found that livestreaming is still in its early stage in the Australian market, but there are already several successful examples. Livestreaming is highly interactive, intuitive, and convenient, and it can match merchants’ needs when used in the right way.

After discussing this with the product manager, we agreed that livestreaming was still worth exploring for Australia — but it needed to be positioned and designed differently.

In May this year, Ya'ako Ke sold 200,000 Australian dollars worth of Western Australian tourism products within one hour of live broadcast.

Current ‘Live streaming’ function in M&G App

From this analysis, I found three key differences:

  • Market maturity: livestreaming commerce is extremely mature in China, while in Australia it is still exploratory.

  • Platform ecosystem: Taobao and Douyin dominate in China, while TikTok and Instagram are more common in Australia.

  • User habits: Chinese consumers are more open to impulse buying, while Australian shop owners prefer search-based and planned purchasing.

Persona :

Rose represents our typical new shop owner — motivated but uncertain, eager to learn what products are worth importing.

Rose

An M&G Shopkeeper

Just start a M&G shop. The store is located next to a school. The back-to-school season is approaching, but I don’t know what products to buy or which products are popular.

Research & Strategy

Bio

Rose just started her business last year, she heard M&G is looking for shop owners join them, After she learned that the company was a Chinese stationery company, she decided to join, but she also had a lot of uncertainties.

Feedback & Refinement

Needs

·A clear way to understand which products she should stock and display in her store · A comprehensive search function to discover new products and trends

Pain Points

·Have no idea about which products can make benefit · Low market visibility, few merchants and consumers know about M&G · Unable to locate products that consumers prefer

Expects

A platform that can highly interactive with headquarters in China, so that have more information to decide which product should she buy.

Testing & Optimization

Empathy map :

Can the products developed by M&G attract local customers?

Livestream function is on the run, what is it?

Are there any ways to get contact with headquarter to seek advice?

Barely hear news or new products from headquarters

Yesterday a customer came into the store and asked if there was a product I had never heard before.

I heard that the headquarters' advice and guidance are available on the app, especially in terms of product promotion and marketing strategies.

Saw a new product yesterday, can I find it on M&G Alliance?

Saw a new product yesterday, don’t know what the price of it, should I sell it on my store?

From my observation, Australian consumers are price sensitive and many prefer to choose well-known brands or local brands.

School season is coming soon... what product should I import

HEAR

SEE

sAY&DO

tHINK&FEEL

Search for new product to put in the store

Understand which products sell better

Can the products developed by M&G attract local customers?

Don't know which item is popular in the trend.

Current function is hard for me to know which item is popular in the trend.

I need to research the local market and understand consumer needs and preferences.

Through the empathy work, I mapped what Rose says, thinks, sees, and does:

She:

  • Wonders if M&G products will attract local customers

  • Hears only occasional news or product updates from HQ

  • Sees customers asking about products she has never heard of

  • Needs to research the local market herself and guess what to import

From this, I distilled three key insights:

  1. Information gap – Shop owners don’t receive timely, structured guidance from HQ

  2. Local uncertainty – They lack confidence about what will sell in their own neighbourhood

  3. Feature mismatch – The current Chinese livestream format focuses on selling fast, not on helping franchisees learn and decide

So the design goal became:

Shift livestream from “entertainment and hard selling”
to “education and product guidance” for shop owners.

Design Strategy:

Based on this, I defined four design principles:

·From entertainment → to guidance
Focus on explaining products, not pushing urgency.

·Make product discovery easy
Categories, search tags, popular ranking, themed sessions.

·Support Q&A for confidence
Chat, product detail panel, real-time explanations.

·Developer-friendly structure
Clear components, spacing, layout rules for easy implementation.

User Flow :

I mapped the journey from the moment Rose realises she needs to restock, to watching a livestream and placing an order.

Key steps in the redesigned flow:

  1. Rose opens the app and sees curated livestream sessions related to her store type (e.g. school supplies).

  2. She joins a relevant stream and watches a host introduce assortments, price points, and local use cases.

  3. She opens the product detail panel to check specifications and suitability.

  4. She asks questions via chat if she is unsure.

  5. She decides whether to add the product to her order.

The flow is optimised around reducing uncertainty, not just driving impulse orders.

Low fidelity :

The empathy map helped me see that lack of timely information was the main frustration across all shop owners. I believe livestream function can help with this problem.

The wireframes focused on validating structure and layout before polishing visuals.

I introduced:

  • A clear livestream entry point on the app

  • Simple categories and tags (e.g. “Back to School”, “Workspace Essentials”)

  • A “Popular” view showing what other shops are buying

  • A stream layout that puts video, key product list, and detail panel into one screen

  • Primary actions: “Add to order”, “Save for later”, and “Ask a question”

These decisions all trace back to the earlier insights about information gaps and confidence.

Moodboard :

High fidelity :

Outcome :

At this stage, we delivered:

  • The full UX concept for the livestream feature

  • User flows from “need to restock” to “place order”

  • Low-fidelity wireframes and key high-fidelity screens

The next step would be to:

  • Test the concept with Australian franchisees

  • Measure whether a guidance-focused livestream:

    • increases confidence in product selection

    • reduces decision time for ordering

My key takeaway

Localisation is not just translating UI.
It is about reframing the purpose of a feature so it fits the behaviour, expectations, and business reality of a new market.

E-commerce

M&G stationery

B2B App Overseas Version Design
Livestream Function

This project is for M&G Stationery, a well-known Chinese stationery brand.
They already have an app called M&G Alliance, which helps franchise stores in China discover products and place orders.
When the company expanded to Australia, they asked me to redesign the app for the Australian market, rather than simply translating the existing Chinese version.

Year :

2025

Industry :

E-commerce

Company:

M&G stationery

Project Duration :

12 weeks

My Role:

I was the UI/UX Designer for the livestream feature in the overseas version of the app.
My work covered user research, problem definition, journey mapping, user flows, and low-fidelity wireframes for the livestream experience.

The Challenge:

One of the biggest challenges was the livestream stock-selection feature.
Livestream commerce is extremely mature in China, but in Australia it is still new and not widely adopted.
This raised two key questions:

  • Should we keep the livestream feature at all?

  • If we keep it, how should we adapt it for Australian shop owners?

Research & Insight:

Before designing the UI & UX for the overseas app, I looked at who the users were in each market. In China, the primary users are franchisees and distribution store owners. The Australian users would have a similar role, but their shopping habits, expectations, and local logistics are very different.
Because of these differences in consumer behaviour and operational efficiency, we couldn’t simply copy the Chinese market logic and apply it to Australia.

Analysis: Livestreaming E-commerce

In the Chinese version of the M&G app, livestreaming is a key feature on the homepage. It is designed to help franchisees discover products that can generate profit.

From my market research, I found that livestreaming is still in its early stage in the Australian market, but there are already several successful examples. Livestreaming is highly interactive, intuitive, and convenient, and it can match merchants’ needs when used in the right way.

After discussing this with the product manager, we agreed that livestreaming was still worth exploring for Australia — but it needed to be positioned and designed differently.

In May this year, Ya'ako Ke sold 200,000 Australian dollars worth of Western Australian tourism products within one hour of live broadcast.

Current ‘Live streaming’ function in M&G App

From this analysis, I found three key differences:

  • Market maturity: livestreaming commerce is extremely mature in China, while in Australia it is still exploratory.

  • Platform ecosystem: Taobao and Douyin dominate in China, while TikTok and Instagram are more common in Australia.

  • User habits: Chinese consumers are more open to impulse buying, while Australian shop owners prefer search-based and planned purchasing.

Persona :

Rose represents our typical new shop owner — motivated but uncertain, eager to learn what products are worth importing.

Rose

An M&G Shopkeeper

Just start a M&G shop. The store is located next to a school. The back-to-school season is approaching, but I don’t know what products to buy or which products are popular.

Research & Strategy

Bio

Rose just started her business last year, she heard M&G is looking for shop owners join them, After she learned that the company was a Chinese stationery company, she decided to join, but she also had a lot of uncertainties.

Feedback & Refinement

Needs

·A clear way to understand which products she should stock and display in her store · A comprehensive search function to discover new products and trends

Pain Points

·Have no idea about which products can make benefit · Low market visibility, few merchants and consumers know about M&G · Unable to locate products that consumers prefer

Expects

A platform that can highly interactive with headquarters in China, so that have more information to decide which product should she buy.

Testing & Optimization

Empathy map :

Can the products developed by M&G attract local customers?

Livestream function is on the run, what is it?

Are there any ways to get contact with headquarter to seek advice?

Barely hear news or new products from headquarters

Yesterday a customer came into the store and asked if there was a product I had never heard before.

I heard that the headquarters' advice and guidance are available on the app, especially in terms of product promotion and marketing strategies.

Saw a new product yesterday, can I find it on M&G Alliance?

Saw a new product yesterday, don’t know what the price of it, should I sell it on my store?

From my observation, Australian consumers are price sensitive and many prefer to choose well-known brands or local brands.

School season is coming soon... what product should I import

HEAR

SEE

sAY&DO

tHINK&FEEL

Search for new product to put in the store

Understand which products sell better

Can the products developed by M&G attract local customers?

Don't know which item is popular in the trend.

Current function is hard for me to know which item is popular in the trend.

I need to research the local market and understand consumer needs and preferences.

Through the empathy work, I mapped what Rose says, thinks, sees, and does:

She:

  • Wonders if M&G products will attract local customers

  • Hears only occasional news or product updates from HQ

  • Sees customers asking about products she has never heard of

  • Needs to research the local market herself and guess what to import

From this, I distilled three key insights:

  1. Information gap – Shop owners don’t receive timely, structured guidance from HQ

  2. Local uncertainty – They lack confidence about what will sell in their own neighbourhood

  3. Feature mismatch – The current Chinese livestream format focuses on selling fast, not on helping franchisees learn and decide

So the design goal became:

Shift livestream from “entertainment and hard selling”
to “education and product guidance” for shop owners.

Design Strategy:

Based on this, I defined four design principles:

·From entertainment → to guidance
Focus on explaining products, not pushing urgency.

·Make product discovery easy
Categories, search tags, popular ranking, themed sessions.

·Support Q&A for confidence
Chat, product detail panel, real-time explanations.

·Developer-friendly structure
Clear components, spacing, layout rules for easy implementation.

User Flow :

I mapped the journey from the moment Rose realises she needs to restock, to watching a livestream and placing an order.

Key steps in the redesigned flow:

  1. Rose opens the app and sees curated livestream sessions related to her store type (e.g. school supplies).

  2. She joins a relevant stream and watches a host introduce assortments, price points, and local use cases.

  3. She opens the product detail panel to check specifications and suitability.

  4. She asks questions via chat if she is unsure.

  5. She decides whether to add the product to her order.

The flow is optimised around reducing uncertainty, not just driving impulse orders.

Low fidelity :

The empathy map helped me see that lack of timely information was the main frustration across all shop owners. I believe livestream function can help with this problem.

The wireframes focused on validating structure and layout before polishing visuals.

I introduced:

  • A clear livestream entry point on the app

  • Simple categories and tags (e.g. “Back to School”, “Workspace Essentials”)

  • A “Popular” view showing what other shops are buying

  • A stream layout that puts video, key product list, and detail panel into one screen

  • Primary actions: “Add to order”, “Save for later”, and “Ask a question”

These decisions all trace back to the earlier insights about information gaps and confidence.

Moodboard :

High fidelity :

Outcome :

At this stage, we delivered:

  • The full UX concept for the livestream feature

  • User flows from “need to restock” to “place order”

  • Low-fidelity wireframes and key high-fidelity screens

The next step would be to:

  • Test the concept with Australian franchisees

  • Measure whether a guidance-focused livestream:

    • increases confidence in product selection

    • reduces decision time for ordering

My key takeaway

Localisation is not just translating UI.
It is about reframing the purpose of a feature so it fits the behaviour, expectations, and business reality of a new market.

E-commerce

M&G stationery

B2B App Overseas Version Design
Livestream Function

This project is for M&G Stationery, a well-known Chinese stationery brand.
They already have an app called M&G Alliance, which helps franchise stores in China discover products and place orders.
When the company expanded to Australia, they asked me to redesign the app for the Australian market, rather than simply translating the existing Chinese version.

Year :

2025

Industry :

E-commerce

Company:

M&G stationery

Project Duration :

12 weeks

My Role:

I was the UI/UX Designer for the livestream feature in the overseas version of the app.
My work covered user research, problem definition, journey mapping, user flows, and low-fidelity wireframes for the livestream experience.

The Challenge:

One of the biggest challenges was the livestream stock-selection feature.
Livestream commerce is extremely mature in China, but in Australia it is still new and not widely adopted.
This raised two key questions:

  • Should we keep the livestream feature at all?

  • If we keep it, how should we adapt it for Australian shop owners?

Research & Insight:

Before designing the UI & UX for the overseas app, I looked at who the users were in each market. In China, the primary users are franchisees and distribution store owners. The Australian users would have a similar role, but their shopping habits, expectations, and local logistics are very different.
Because of these differences in consumer behaviour and operational efficiency, we couldn’t simply copy the Chinese market logic and apply it to Australia.

Analysis: Livestreaming E-commerce

In the Chinese version of the M&G app, livestreaming is a key feature on the homepage. It is designed to help franchisees discover products that can generate profit.

From my market research, I found that livestreaming is still in its early stage in the Australian market, but there are already several successful examples. Livestreaming is highly interactive, intuitive, and convenient, and it can match merchants’ needs when used in the right way.

After discussing this with the product manager, we agreed that livestreaming was still worth exploring for Australia — but it needed to be positioned and designed differently.

In May this year, Ya'ako Ke sold 200,000 Australian dollars worth of Western Australian tourism products within one hour of live broadcast.

Current ‘Live streaming’ function in M&G App

From this analysis, I found three key differences:

  • Market maturity: livestreaming commerce is extremely mature in China, while in Australia it is still exploratory.

  • Platform ecosystem: Taobao and Douyin dominate in China, while TikTok and Instagram are more common in Australia.

  • User habits: Chinese consumers are more open to impulse buying, while Australian shop owners prefer search-based and planned purchasing.

Persona :

Rose represents our typical new shop owner — motivated but uncertain, eager to learn what products are worth importing.

Rose

An M&G Shopkeeper

Just start a M&G shop. The store is located next to a school. The back-to-school season is approaching, but I don’t know what products to buy or which products are popular.

Research & Strategy

Bio

Rose just started her business last year, she heard M&G is looking for shop owners join them, After she learned that the company was a Chinese stationery company, she decided to join, but she also had a lot of uncertainties.

Feedback & Refinement

Needs

·A clear way to understand which products she should stock and display in her store · A comprehensive search function to discover new products and trends

Pain Points

·Have no idea about which products can make benefit · Low market visibility, few merchants and consumers know about M&G · Unable to locate products that consumers prefer

Expects

A platform that can highly interactive with headquarters in China, so that have more information to decide which product should she buy.

Testing & Optimization

Empathy map :

Can the products developed by M&G attract local customers?

Livestream function is on the run, what is it?

Are there any ways to get contact with headquarter to seek advice?

Barely hear news or new products from headquarters

Yesterday a customer came into the store and asked if there was a product I had never heard before.

I heard that the headquarters' advice and guidance are available on the app, especially in terms of product promotion and marketing strategies.

Saw a new product yesterday, can I find it on M&G Alliance?

Saw a new product yesterday, don’t know what the price of it, should I sell it on my store?

From my observation, Australian consumers are price sensitive and many prefer to choose well-known brands or local brands.

School season is coming soon... what product should I import

HEAR

SEE

sAY&DO

tHINK&FEEL

Search for new product to put in the store

Understand which products sell better

Can the products developed by M&G attract local customers?

Don't know which item is popular in the trend.

Current function is hard for me to know which item is popular in the trend.

I need to research the local market and understand consumer needs and preferences.

Through the empathy work, I mapped what Rose says, thinks, sees, and does:

She:

  • Wonders if M&G products will attract local customers

  • Hears only occasional news or product updates from HQ

  • Sees customers asking about products she has never heard of

  • Needs to research the local market herself and guess what to import

From this, I distilled three key insights:

  1. Information gap – Shop owners don’t receive timely, structured guidance from HQ

  2. Local uncertainty – They lack confidence about what will sell in their own neighbourhood

  3. Feature mismatch – The current Chinese livestream format focuses on selling fast, not on helping franchisees learn and decide

So the design goal became:

Shift livestream from “entertainment and hard selling”
to “education and product guidance” for shop owners.

Design Strategy:

Based on this, I defined four design principles:

·From entertainment → to guidance
Focus on explaining products, not pushing urgency.

·Make product discovery easy
Categories, search tags, popular ranking, themed sessions.

·Support Q&A for confidence
Chat, product detail panel, real-time explanations.

·Developer-friendly structure
Clear components, spacing, layout rules for easy implementation.

User Flow :

I mapped the journey from the moment Rose realises she needs to restock, to watching a livestream and placing an order.

Key steps in the redesigned flow:

  1. Rose opens the app and sees curated livestream sessions related to her store type (e.g. school supplies).

  2. She joins a relevant stream and watches a host introduce assortments, price points, and local use cases.

  3. She opens the product detail panel to check specifications and suitability.

  4. She asks questions via chat if she is unsure.

  5. She decides whether to add the product to her order.

The flow is optimised around reducing uncertainty, not just driving impulse orders.

Low fidelity :

The empathy map helped me see that lack of timely information was the main frustration across all shop owners. I believe livestream function can help with this problem.

The wireframes focused on validating structure and layout before polishing visuals.

I introduced:

  • A clear livestream entry point on the app

  • Simple categories and tags (e.g. “Back to School”, “Workspace Essentials”)

  • A “Popular” view showing what other shops are buying

  • A stream layout that puts video, key product list, and detail panel into one screen

  • Primary actions: “Add to order”, “Save for later”, and “Ask a question”

These decisions all trace back to the earlier insights about information gaps and confidence.

Moodboard :

High fidelity :

Outcome :

At this stage, we delivered:

  • The full UX concept for the livestream feature

  • User flows from “need to restock” to “place order”

  • Low-fidelity wireframes and key high-fidelity screens

The next step would be to:

  • Test the concept with Australian franchisees

  • Measure whether a guidance-focused livestream:

    • increases confidence in product selection

    • reduces decision time for ordering

My key takeaway

Localisation is not just translating UI.
It is about reframing the purpose of a feature so it fits the behaviour, expectations, and business reality of a new market.

Create a free website with Framer, the website builder loved by startups, designers and agencies.