Fang DONG

work      about



























2020-2021
︎Award | Case Study | Web Development | UI&UX | Event Planning | Public Space

Institution: Cité de l'architecture & du patrimoine de Pari, Mairie Chapelle-Faucher 
Team MM15: Mi ZHOU, Daqiang LIU, Fang DONG
Role: Creative Director, Product Desinger, Web Developer, Illustrator

Massage, message 

A massage journey that allows the acquisition of digital knowledge over time, a series of e-readings, and a mutual aid service for using the Internet.


The Massage, Message project was designed for the Mini Maousse7 “Virtual Schola” competition organized by the Cité de l'Architecture et du Patrimoine in Paris. The research focused on the city of Chapelle-Faucher, addressing the theme of "proposing friendly micro-architecture to tackle the challenge of the digital divide." The goal is to recreate community life around a technological module in rural communities or sensitive urban areas. The project was selected and awarded(link︎︎︎), receiving support from the Chapelle-Faucher government.


The Massage, Message project includes the following key components:

1. Website:
massagemessage.com, where users can obtain a free "travel massage" ticket through six steps, experiencing digital learning and community mutual aid services.

2. Mobile Massage Station:
A 3.3m x 2.2m x 2.2m truck platform equipped with 15 massage structures and related facilities, providing an experience that combines digital knowledge with traditional culture.

3. On-site Activities:
Held at Domaine de Barbarie, la Chapelle-Faucher, Dordogne, these activities help residents register and use digital devices through interactions with local residents, promoting digitalization within the community.


Virtual Schola, for us, is a cyberspace for leisure and learning that implements a form of mutual aid. Thanks to a residency and the cooperation of the collective "Traverses & Inattendus," the Massage, Message project offers a travel massage concept at Domaine de Barbarie, la Chapelle-Faucher in Dordogne.




Understand

︎Research


By participating in the local artist residency program Traverse, Inattendu (8) for several months, I gained an in-depth understanding of local issues and relationships. To further ensure the project effectively addresses the digital divide, we conducted comprehensive user research, including:

︎Geographical and Climatic Analysis (1-2):

Conducted preliminary geographical and climatic analysis using data provided by the Chapelle-Faucher government.


︎Historical and Cultural Background (3):

Studied the city's religious history and cultural background at the Chapelle-Faucher government archive office and library.



︎Population Analysis (4):

Analyzed population migration changes and reasons over the past five years using data from the Chapelle-Faucher government data office.


︎User Interviews (4):

Conducted face-to-face interviews with residents of rural communities and sensitive urban areas to understand their difficulties and needs in using digital technology.

︎Surveys:

Collected extensive data through surveys to analyze different communities' acceptance and preferences for digital technology.


︎Field Observations (5):

Conducted field visits in the target community Domaine Barbarie, observing residents' daily lives and social activities to gather first-hand information.


︎Main Employment (6):

Researched local main products like Palox, visited factories, and learned about the craftsmanship.


︎Daily Activities (7):

Learned about the schedule of local recreational activities and visited public entertainment facilities, schools, and sports fields.


If we consider the digital divide as an imbalance and blockage in society, and society as a living organism, can we use traditional Chinese medicine to "heal" this imbalance? How can cyberspace and massage be deployed within a rural village? And how do we connect to cyberspace through the "Travel Massage"? In what ways and how can this experience be central to this nomadic school?


︎Surveys:




Ideation

︎User Personas and User Stories


Based on the user research data, we created a series of user personas and comic-style user stories:
(Left to Right):

1. Jean Paul, a 65-year-old local resident, lives alone and is unfamiliar with new technology. His children live in other big cities.

2. The new phone and computer he received as gifts remain unopened as he continues to use his radio and old mobile phone.

3. One day, he finds a flyer about the Massage, Message event in his mailbox and becomes interested but unsure about it.



4. He calls Claud, a well-known local resident and government employee, to inquire about the event details. Claud strongly recommends Jean Paul to attend.

5. On the event day, Jean Paul arrives at Domaine Barbarie with his dog.

6. The staff warmly welcomes him, patiently explaining the process and how to use new tools. With others' help, Jean Paul not only participates in the event but also relaxes, learns new technology, and interacts with other residents.




︎Information Architecture


To optimize user experience, we designed a clear information architecture:
Website Structure (Online): Includes six steps - user login, service selection, e-book reading, registration, sending, and downloading, helping users complete each operation easily.

︎Site map





︎Wireframes

 
On the massagemessage.com website, to receive a free Travel Massage ticket, there are six steps: Login, Choose, Read, Register, Send, Download. After the first travel experience, users can return to their account to check the tickets earned, comments, and start again to win a new journey.

︎Quick sketch:



︎Mid-fi wireframes: 





︎Proposition of Mobile Massage Station

On-site Layout (Offline):Designed an integrated space layout at the site, including massage chairs, frames, hammocks, pathways, and network bar equipment, ensuring user comfort and convenience.



︎ On-site process: 

Where? What? How?



︎Proposition A:

1. Massage Chair: Sur le Depart



︎Proposition B:

2.Passage: En route



︎Proposition C:

3.New Age disposition: Monter à bord



Design - Final Proposition

︎Concept


The project aims to create a world that fuses virtual and reality, combining modern digital technology with traditional Chinese medicine. We view the village of Chapelle-Faucher as an organism, using massage structures to simulate traditional Chinese treatments, addressing the social imbalance caused by the digital divide.


︎Projet Deliverables


The Massage, Message project includes the following key components:

︎1. Website:

massagemessage.com, where users can obtain a free "travel massage" ticket through six steps, experiencing digital learning and community mutual aid services.


︎User Interface

In UI design, we chose a blue-based color scheme to reflect the concept of "fluid organisms." Using comic-style illustrations, we simplified information and steps, making it easy for users to find the necessary functions and information intuitively, ensuring visual appeal while maintaining readability and operability.






︎2. Mobile Massage Station:

︎3.3m x 2.2m x 2.2m truck platform


Our flatbed truck contains 8 massage seats, 6 frames, hammocks, passage elements, and cyberbar equipment. Domaine de Barbarie is equipped with electricity and water.


︎15 massage structures : Massage chairs, Passage and New age disposition.


Related facilities, providing an experience that combines digital knowledge with traditional culture

︎Massage chairs


︎Passage


︎New age




︎3. On-site Activities:


Held at Domaine de Barbarie, la Chapelle-Faucher, Dordogne, these activities help residents register and use digital devices through interactions with local residents, promoting digitalization within the community.

On-site, our team assists residents in registering and using the machines. Our flatbed truck can transform into a cyberbar. We consider the village of la Chapelle-Faucher as a human body, and the 15 massage structures installed at Domaine de Barbarie simulate traditional Chinese medicine treatment. The Travel Massage creates a route for toning: Massage Seat (stimulate) - Passage (disperse) - Novel Age (tone).




Interaction

︎Senario:








︎Usability Testing


Our journey is a process of knowledge experience: inhabiting, gaining new perspectives on the Internet, and learning from each other while engaging with traditional Chinese cultures.







︎Exhibition & Publish




Reflection

︎Project Management




Project Team MM15

  • Mi ZHOU: Responsible for layout, graphic design, and user interface design
  • Daqiang LIU: Responsible for architectural design, 3D modeling, and physical model creation
  • Fang DONG: Responsible for copywriting, illustration design, user experience design, web development, and coordination with local government and art organizations


Project Timeline The entire project lasts one year and is divided into four phases, each lasting three months:

  1. Selection Phase: Initial selection, concept design, and submission of preliminary proposals
  2. Model Phase: Model creation, prototype development, and initial testing
  3. Award Phase: Design optimization, detail refinement, and participation in award competitions
  4. Exhibition Phase: Exhibition preparation, installation, and public interaction


Project Management Methodology To ensure smooth progress and efficient management of the project, we adopted Agile and Sprint management methodologies. The specific implementation steps are as follows:


1. Project Planning and Task Allocation

At the project's inception, we conducted detailed project planning, clearly defining the goals and tasks for each phase:

  • Tasks for Mi ZHOU:
    • Create graphic designs and UI interfaces
    • Develop and maintain design specifications and style guides
    • Design the user interface for the website and digital platforms

  • Tasks for Daqiang LIU:
    • Architectural design and 3D model creation
    • Develop physical and digital models
    • Ensure structural design feasibility

  • Tasks for Fang DONG:
    • Copywriting and illustration design
    • User experience design and web development
    • Coordinate with local government and art organizations


2. Agile Management and Sprint Cycles

Each phase is divided into multiple sprint cycles, each lasting two weeks. Each sprint cycle includes the following steps:
  1. Planning Meeting: At the start of each sprint cycle, the team holds a planning meeting to set goals and tasks and assign specific work.
  2. Daily Stand-ups: Short daily meetings in the morning to report progress, discuss issues, and coordinate solutions.
  3. External Feedback: Weekly presentations to different professors and designers for feedback, followed by organization and improvements.
  4. Sprint Review: At the end of each sprint cycle, the team conducts a review to summarize completed tasks, evaluate effectiveness, and discuss improvements.


3. Communication and Collaboration

To ensure effective communication and collaboration among team members, we implemented the following measures:
  • Regular Meetings: Weekly team meetings to report progress, discuss issues, and propose solutions.
  • Use of Collaboration Tools: Utilized various collaboration tools (such as Trello, Slack, Keynote, Google Drive, Baiduyun) for task management, file sharing, and real-time communication, ensuring transparency and efficient information transfer.
  • Feedback Mechanism: Established a timely feedback mechanism, encouraging team members to provide constructive feedback to each other for continuous improvement and optimization of the design.


4. Iteration and Testing

In each phase, we conducted multiple iterations and tests to ensure project quality and feasibility:
  • Prototype Testing: Developed low-fidelity and high-fidelity prototypes, conducted user testing locally, collected feedback, and made improvements.
  • Model Creation: Created physical and digital models, conducted structural and functional tests, ensuring design feasibility.
  • User Experience Testing: Optimized user experience design through on-site testing and user feedback.


5. Exhibition Preparation and Implementation

In the final phase of the project, we focused on preparing for the exhibition:
  • Installation: Designed and installed exhibition structures, ensuring each part effectively showcased the project's outcomes.
  • Public Interaction: Organized public interaction activities to introduce the project's background and design concepts, and collected audience feedback.


︎Conclusion:


The Massage, Message project showcases innovative design methods and technologies, creating a unique community experience through the integration of visual art, digital media, and traditional culture. It simplifies information transmission through comics and voice-assisted mutual aid, lowers the entry barriers, and establishes a mindset for using new technology through offline interactions like games and massages. Effective information dissemination utilizes local communication methods (renowned residents, government flyers, nomadic shops, etc.) and a coupon mechanism to encourage residents to actively participate in mutual aid and learning new technologies. This approach offers a thoughtful and playful solution to real social problems.



© F.D heavyherbe 2024 | Member of Alliance France Design