Case study

Xiao Qu Luo Pan

The first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

role

Only designer

Platform

WeChat mini-app

My Contribution

UI / UX Design

Data Visualization

Background

2019 Shenzhen Open Data Application Innovation Competition (SODiC), co-organized by Shenzhen Municipal Government Service Data Management Bureau, together with the People's Government of Pingshan District and Qianhai Administration. With the theme of "Digital Gathering in Guangdong, Hong Kong and Macao, Wise Convergence in the Greater Bay Area", the competition solicits innovative application solutions based on open data for the Mainland, Hong Kong and Macao.

Quanturban registered for the competition and won the first place in the data creativity competition through the "Xiao Qu Luo Pan" WeChat Mini-App.

Xiao Qu Luo Pan wan the first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

UI design

Xiao Qu Luo Pan uses government development data, combined with Quanturban's experience and calculation models accumulated in the real estate field, to launch a product that helps ordinary users gain a comprehensive understanding of Shenzhen's neighborhoods.

The evaluation of the value of a neighborhood cannot be done without data. We have compiled data on 15 dimensions such as living comfort, transportation convenience, living convenience, child-friendly, elderly-friendly, environment, education, medical care, culture and entertainment, pet-friendly, etc., and set different weights to evaluate the value of the neighborhood.

  • Compass Design: The design uses a 15 equal points Nightingale Rose Chart in order to show the performance of the neighborhood on each dimension more intuitively and echo the "compass", each sector corresponds to one of our evaluation indicators, in addition to using gradient colors to make the visual effect richer.
  • Score design: Unlike previous enterprise products of Quanturban, this entry is mainly for ordinary users, so the design is also pursued to be more friendly and interesting. On the score page of the cell details, Emoji with different expressions are used to correspond with the score, so that users can understand the approximate score of the cell even without looking at the specific score.
  • Bottom menu interaction: The applet design makes extensive use of the bottom menu (Bottom sheet) interaction, which shows key information by default, and drag up to expand the complete page to show detailed information; it can meet the user's need for quick access to information, but also reduces the number of steps to operate than entering a new page, pop-up windows and other methods.

Visualizing the score of neighborhoods

Motion exploration

Motion exploration

Motion exploration

Other page design of WeChat Mini-App

Thanks for watching!

Case study

Xiao Qu Luo Pan

The first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

role

Only designer

Platform

WeChat mini-app

My Contribution

UI / UX Design

Data Visualization

Background

2019 Shenzhen Open Data Application Innovation Competition (SODiC), co-organized by Shenzhen Municipal Government Service Data Management Bureau, together with the People's Government of Pingshan District and Qianhai Administration. With the theme of "Digital Gathering in Guangdong, Hong Kong and Macao, Wise Convergence in the Greater Bay Area", the competition solicits innovative application solutions based on open data for the Mainland, Hong Kong and Macao.

Quanturban registered for the competition and won the first place in the data creativity competition through the "Xiao Qu Luo Pan" WeChat Mini-App.

Xiao Qu Luo Pan wan the first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

UI design

Xiao Qu Luo Pan uses government development data, combined with Quanturban's experience and calculation models accumulated in the real estate field, to launch a product that helps ordinary users gain a comprehensive understanding of Shenzhen's neighborhoods.

The evaluation of the value of a neighborhood cannot be done without data. We have compiled data on 15 dimensions such as living comfort, transportation convenience, living convenience, child-friendly, elderly-friendly, environment, education, medical care, culture and entertainment, pet-friendly, etc., and set different weights to evaluate the value of the neighborhood.

  • Compass Design: The design uses a 15 equal points Nightingale Rose Chart in order to show the performance of the neighborhood on each dimension more intuitively and echo the "compass", each sector corresponds to one of our evaluation indicators, in addition to using gradient colors to make the visual effect richer.
  • Score design: Unlike previous enterprise products of Quanturban, this entry is mainly for ordinary users, so the design is also pursued to be more friendly and interesting. On the score page of the cell details, Emoji with different expressions are used to correspond with the score, so that users can understand the approximate score of the cell even without looking at the specific score.
  • Bottom menu interaction: The applet design makes extensive use of the bottom menu (Bottom sheet) interaction, which shows key information by default, and drag up to expand the complete page to show detailed information; it can meet the user's need for quick access to information, but also reduces the number of steps to operate than entering a new page, pop-up windows and other methods.

Visualizing the score of neighborhoods

Motion exploration

Motion exploration

Motion exploration

Other page design of WeChat Mini-App

Thanks for watching!

Navigation

Case study

Xiao Qu Luo Pan

The first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

role

Only designer

Platform

WeChat mini-app

My Contribution

UI / UX Design

Data Visualization

Background

2019 Shenzhen Open Data Application Innovation Competition (SODiC), co-organized by Shenzhen Municipal Government Service Data Management Bureau, together with the People's Government of Pingshan District and Qianhai Administration. With the theme of "Digital Gathering in Guangdong, Hong Kong and Macao, Wise Convergence in the Greater Bay Area", the competition solicits innovative application solutions based on open data for the Mainland, Hong Kong and Macao.

Quanturban registered for the competition and won the first place in the data creativity competition through the "Xiao Qu Luo Pan" WeChat Mini-App.

Xiao Qu Luo Pan wan the first prize in the "2019 Shenzhen Open Data Application Innovation Competition".

UI design

Xiao Qu Luo Pan uses government development data, combined with Quanturban's experience and calculation models accumulated in the real estate field, to launch a product that helps ordinary users gain a comprehensive understanding of Shenzhen's neighborhoods.

The evaluation of the value of a neighborhood cannot be done without data. We have compiled data on 15 dimensions such as living comfort, transportation convenience, living convenience, child-friendly, elderly-friendly, environment, education, medical care, culture and entertainment, pet-friendly, etc., and set different weights to evaluate the value of the neighborhood.

  • Compass Design: The design uses a 15 equal points Nightingale Rose Chart in order to show the performance of the neighborhood on each dimension more intuitively and echo the "compass", each sector corresponds to one of our evaluation indicators, in addition to using gradient colors to make the visual effect richer.
  • Score design: Unlike previous enterprise products of Quanturban, this entry is mainly for ordinary users, so the design is also pursued to be more friendly and interesting. On the score page of the cell details, Emoji with different expressions are used to correspond with the score, so that users can understand the approximate score of the cell even without looking at the specific score.
  • Bottom menu interaction: The applet design makes extensive use of the bottom menu (Bottom sheet) interaction, which shows key information by default, and drag up to expand the complete page to show detailed information; it can meet the user's need for quick access to information, but also reduces the number of steps to operate than entering a new page, pop-up windows and other methods.

Visualizing the score of neighborhoods

Motion exploration

Motion exploration

Motion exploration

Other page design of WeChat Mini-App

Thanks for watching!

Navigation