Shang Dongting's profolio by toutouer

Dongting's Profolio

About Me

Shang Dongting Interaction Designerďź&#x152;Graphic Designer Born in China in 1989 Admited in TianJin academic of fine arts studying the major of Visual communication design in 2008 Studying in the Interactive digital media studio of Central Academy of Fine Arts in 2012 Entering CTV Golden Bridge International Media Group in 2013 1

Profolio

Table of contents INTERACTIVE

VISUAL

DESIGN

LIVE CLUB Application Development of the Smart Television

SINA WEIBO MAC Research and development system for the client

ECHO School elevator system solution

ZI ZHU IOS APP Development

PERSONAL WORKS SHOW Interactive animation forpersonal promotion

5 17 34 45 55

Visual propaganda film

DNA Adobe After Effects

LOGO Logo Design

CHINA AGRICULTUR Visual idebtity system man

MACARON Brand Packing Design

HTC Poster Design

FAMOUS HOME Household store brand packaging

CHARACTOR DESIGN

VIDEO DESIGN Visual

COMMUCATION

Illustration design

CAR 117

Format Design

MEN AND FRAGRANCE 123

Photography

69 73 76 83 93 101 107 111

Profolio

PERSONAL WORKS SHOW

INTERACTIVE DESIGN

Profolio

LIVE CLUB Application Development of the Smart Television

Summaries of the project： Live Club is the winner project of the digital media Interactive Studio of Central Academy of Fine Arts and University-enterprise cooperation project of Tencent company. I participated the design partof vision and mutual as the chief designer. Live Club is a Real-time communication platform for the lonely fans. Fans can communicate with the friends around from this APP. They can interact with this platform simultaneously as well.

Project Types：Application Development of the Smart Television Time：In October 2011 - January 2012

We came up with some functions such as Real-time communication ， DJ channel， Climax Reminder，Real-time information，Beer plan and Venting device. We can basically solve the problem with football from different fans.

Profolio

I want to feel involved in the scene

Profolio

CONCEPT DESIGN User Analysis

Function： Real-time communication： Facing TV, you are not a spectator alone. No matter the cheer or shits we can feel everyone is talking about the football, we can give you a real court. Function：The uesr cheer through the microphone inside the TV and they can hear that form other uesrs who watching the same match at the same time. They can take the real-time communication and argue with each other.

Venting device：

surf the Internet

Do you want to show your physical expression when you watching the game? Have you

Hysteresis Damping Communication is not timely

1、Remain within doors

2、Struck a chord amoung the fans

LONELY FANS

of abreaction completely. Others can feel you.

1、All the information is contained

2、Save time and effort

lonely Small amount of information

ever broken the sofa when you were watching TV? This function can give you the space

1、real-time information

Function：Express your emotion through the venting device inside and the picture can be seen on others’screens.

Climax Reminder：

BAR Time consuming and expensive

2、 information outbreak

Physical sensor: it can tell you the change of emotion of fans and avoid any exciting climax. There will no pity for watching football at home Function：We specially designed the rings for uses can recognize the muscular tension of users. When you watching the game in the chatroom, football fans will become excited and the shake of the rings will make you pay attention instantly.

Beer Plan Believe or not. Let’s bet it. When you see the splendid moment, having a bottle of beer and enjoying belles can make others admire you. Function: Through recharge the consumption volume, you can use it to bet with friends. Cheer up for your team and enjoy the cool beer.

communication platform

real time data + double screens termination The connector of WIFI covered with the MT. You can check the real time news and data statistics. More topics and more gossips Function : Users can see the immediate news data，statistics，price change and comments through the MT of WIFI

Profolio

Public Channel

Private Channel

（Built by the offical）

（With a restricted number of visitors）

LIVE CLUB

Real-time communication function

Fans

DJ LIVE CLUB

fans and audience

Fans

Winner

1. invit a friend

3 4

Beer Plan function

5. get the result after the game over

Loser 1

2.guess the game

6. choose to extract the quantity of the goods

3. to bet

4. watching the game and interact with each

7. suppliers deliver the goods

8. enjoy and begin the next round

INTERACTIVE DESIGN AND VISUAL COMMUCATION

Colour Combinationďź&#x161; We extracted many websites,APP,color combination and the dress color related to sports and football. We want to find what we want by this way.

Profolio

LOGO Designďź&#x161; We designed our LOGO according to the "hot and sexy" No serious temperamentâ&#x20AC;&#x2122;befor we had extracted the visual style we wanted and the color combination.Because of the strong identity of the football we hope the LOGO can be expanded.

Profolio

FLOW CHART lOG IN Personal Center

DJ Channel

Join in the channel Choose the invitation

Real-time information

Choose DJ

Video set Real-time information

Cash beer

Record game

Bet with beer

Beer system Video time

Information Charging Exchange

Real-time expression

Record game Send the invitation

Choose theme Choose game

DJ 1

DJ 2

Picture

News

Picture

Information for live

Push information

Comment

Personal information

Video

Exchange Icon

Invite

DJ Channel

Picture

News

Picture

Information for live

Bet

Icon Icon

Picture

Personal information

DJ channel

Comment

Join

Send invitations

Annotation The primary navigation

Profolio

Exchange Head portrait

Send invitation

Peport

Predict

Sub-navigation

Picture signal

Nav_third

Link the ‘Beer’

Four levels of navigation

Link the ‘video’

SINA WEIBO MAC Research and development system for the client Summaries of the project： This is a research project. It’ s a project of the National college students' innovative undertaking plan. I’ m in charge of the project University-enterprise cooperation project Microblog is the best symbol of this age. Nearly everyone interact by the microblog. As a interaction designer, I pay more attention to how to get better experience when using the mircoblog. As the leading enterprise in modern IT industry, Apple has thousands of iFans, but the MAC system is being deeply rooted among the people step by step. For Sina microblog, the users of MAC represent a group of people as designer and artist. If we can popularize the microblog among these people and tailor a WIMAX CPE which satisfy the habit of users and accord with the microblog users, the brand value of Sina microblog will be a further improvement

Item type : Research topic The client design and development

Time：in September 2011 - January 2012

This project is as a research topic, from the beginning to the preliminary market research, from the questionnaire survey and all aspects of separation to the analysis phase in the medium-term, from the defination of the users, Tomomi Fujino and new functions to designing the Open API in the later period, we came up with the defination of‘Personal media publishing platform’ . We also presented some functions which can meet the need of us such as‘Cross navigation’ ’ V browse’ ’ Microblog index’ ’Directional release’ and‘Quanzi’ and offered enough research data for further development for Sina Corp.

Profolio

@ news gossip

@ weibo public relation @ one key to transfer the microblog @ resource of stars @ micro film review

@ open to public

@ sharp business sense

@ advantage of SINA @ self speculation

@ contact with the media frequently

@ the generation after 90s

@ enterprise culture

@ the generation after 00s

@ younger

@ the generation after 80s

@ micro log marketing

@ the generation after 70s @ real name identification @ fashion pushing hands @ control of public opinion @ open the APP interface

@ economy company

@ exploitation of the international@ market @ strengthen the ability

a more open attitude

@ micro blog cell phone @ International brand image

@ The development of weibo application platform future of SINA @

@ The development of weibo derivatives @ More open access

Profolio

@ The strategic orientation of globalisation

@ The development of weibo derivatives

@ The support of national policy

@ Not limited in the Chinese market

More customized Settings

@ A better user experience

@ More diversified

@ OS system for micro log

PRODUCT ANALYSIS

Webio expert

originality

Relay

City Webio

Vote

film review

Hall of Fame

Square

activity

Webio desktop

Small Radio

Webio AIr

Small Data

send webio

Medal

billboard

Public platform

disk

API

attestation

see webio

Send a webio transpond

Ranking

Search attention

Account Settings

comment

Star system

apply

Game

Individual window

Sina Weibo

live broadcast

picture

Recommend

vote

video

Profiles collection

groupuscule

Social Network Site

square

relation

collect

message

chat

Photo

Music

Personal Information @

groupuscule

comment

message

chat

attention

attestation

Recommend

flesh search

search webio

Profolio

Which function of sina weibo do you think is not necessary to appear on the MAC client-side?

QUESTIONNAIRE AND ANALYSIS

A、Weibo application B、Micro interview C、Mini-games D、Weibo E、Follow Recommendations

Place：IKEA Salitun Network platform

E Game cannot be attached

Which function do you hope to add to the sina weibo MAC client-side?

A、Screenshot B、Automatically compressed images

C、Instant Messaging D、Multi-account login

No one left

Do you think it is necessary to enrich the V-adding system, and to increase the ordinary employment assessment? A、necessary B、unnecessary

Not that simple

Competition analysis: The identity of the Internet

Competition analysis: The Internet's underpants

Profolio

REQUIREMENTS TO MAC DESKTOP CLIENT-SIDE

33%

62%

THE CLIENT-SIDE FUNCTION MOST SIRABLE TO REALIZE Drag and drop to share pictures, videos, music

Browse the followed persons

Customize the skin

Write a weibo

Private conversation

Hot issues

Weibo group discussion sector

Access to professional industry consultation

Set a customized category when releasing a weibo

Propaganda oneself

Link up with the mailbox

Find suggestions

WEIBO FUNCTION POPULARITY INDEX

Profolio

AUTOMATICAL ATTENTION TO THE INDEX

@ Friends

Friends weibo

Send weibo

Celebrities weibo

Compose mail

Current news

Chat

Popular topics

Micro topics

Favorite brand weibo

Vote

Shopkeeper information

Groupuscule

WEIBO CLIENTS EXPERIENCE INDEX

ANALYSIS OF ECOSYSTEM OF WEIBO COMMUNIT Visual information presentation

Profolio

（Fashion information classification）

The pursuit of fashion （Excavate possibilities at a deeper level）

（Encourage originality promote enthusiasm ）

Pure natural

Enjoy oneself to the full

（Fastest way of record ）

Along with the nature

Anytime

（Wide range）

Without aim （Freedom of speech）

（Browse categories clear thought）

Open

Inspiration Personality

（More emphasis on client experience）（Privacy and publicity are relatively reasonable）

Idealized independent world （Image display）

Emotional release （no blind follow）

Principle

Literature and art

（Actively cultivate good habits of users, interactive way）（Unique group chain）

Temperament

Active character

Reliable

（More low-key or personality interface style）

False beyond

（A clear navigation module）

Intellectuality

Perceptual processing

（Get rid of the bad function）

connotation and cultivated （Reading more clear）

Rational cognition

（Reply and @ function independently）

Vanity psychological desire to be focus on （ reduced function）（Apple-approved）

Apple's worship

Show off

Difference （send the pictures and function of music）

Strong desire to show

（Magic effect large ICONS）

The unique visual

Profolio

系统设置主界面搜索

发微博

信息中心

联系人

新微博

信息个人信息

微博

TA上一条微博

粉丝

加关注

发帖指数

分组

TA下一条微博

关注

取消关注

私信

TA的主页

好友

发私信

@我

时间天气

转发评论 @TA 发私信

@TA TA的主页取消关注发私信 @TA TA的主页发私信

表情

收件箱

删除

图片

发件箱

发私信

微博

TA的主页

回复删除 TA的主页删除 TA的主页 TA上一条微博 TA下一条微博

@TA 转发 TA的主页评论 TA的主页 @TA 发私信 TA的主页

Profolio

@ 140+

新浪微博MAC客户端

信息处理中心

微博

信息

评论 @TA 删除

回复删除

发私信 TA的主页

粉丝

@我

私信

个人主页

主界面

TA上一条微博

加关注

删除

TA下一条微博

取消关注

TA的主页

发私信

@TA

TA的主页

@TA 发私信

功能导航一级导航二级导航三级导航四级导航五级导航索引导航

Profolio

THE BLOCK DIAGRAM OF THE PROCESS LINE OF THE JAVA SYMBIAN

Profolio

CLIENT DEMO DESIGN

Profolio

CLIENT DEMO DESIGN

Profolio

ECHO School elevator system solution Summaries of the project： This is a research project, the goal is to solve certain problem related to the elevator system of CAFA, and also let the user can have some interactions with people around them when they looking for elevators, waiting for elevators and entering elevators, in this way, people can make full use of their riding time. Based on this problem, I do several investigations and propose my solution. Firstly, when the in the mass or facing multiple elevators, it’ s hard for people to notice which elevator’ s door has opened, and some elevators open its door just in a few seconds, if users did not pay attention to them, or old people with a slow pace, it’ s hard for them to get on the elevator.Then, in the high-rise elevators, people stay longer in the elevator, most people will play with their cellphones or daze by themselves, there is rarely interactions between strangers.

Item type :School elevator system solution

Based on this problem, I proposed several solutions, utilizing vibration, light sensor and a lighting system to provide light signals to help people noticed the door open. Install interactive device on inside and outside, provide more joyful and funny user experience for people who using the elevator. Provide inspirations for people to make connections or have dialogue. Initiate exchanges between people and their neighbors, and break the silence, uneasy feeling, and other distress, anxiety, etc., let laughter and noise to cover all the space.

Time：In November 2011 - January 2012

Profolio

“All nature and mankind was originally designed to have this capability to communicate with each other, either through language, or other media. Essentially and eventually, there’s been care, love and a sense of connection.”

Interactive Design - ECHO

Interactive Designers - ECHOGIST Interactive Design Methodology - ECHOLOGY

Profolio

SPACE PEOPLE

ELEVATOR

ELEVATOR PEOPLE SPACE By defining ECHO Communication,Connection,and Convercation,we chose elevator to try interpreting the ECHO system above. U n e x p e c t e d l y, t h e s e k e y w o r d s a p p e a r e d d u r i n g t h e brainstorming,actual research and surveys proces. -Status of Connectivity and Dis-connectivity -Communication and Sense of Community -Enlighten and Delight -Response and Responsibility -Function and Fun

Profolio

Start with the first model Enhance the conversation

Elevator system solutions at school of design,central academy of fine Arts(CAFA).

- Challenge 1 “Where is my elevator?”

Confusing situation where people find it difficult to notice the elevator that opens for services when it arrives.

very

- Challenge 2 “Wait for me!”

Elevator door opening duration is too short for people to get there.

- Challenge 3 “Could it be of more fun and more interacitve?”

People use lift almost everyday and people meet people there, why couldn’t be anything interactive and fun happening?

- Solution 1

Vibration and light sensors plus lighting system, providing light signal to help people notice the door opening.

- Solution 2

Elevator system default setup.

- Solution 3

Interactive installations inside and outside the lift, providing more interactive experience and fun while people are using the elevator.

Profolio

Elevator light installation at CAFA"TALK TO ME PLEASE OR LAUGH OUT LOUD" Purpose1- Improve the user experience of the elevator system Purpose2 - Enlighten the conversation between people and the space Purpose3 - Initiate the communication between people and their neighbours,Break the silence and uneasy feeling of various kinds,such as embarassment,unsafety,distrustfulness,ect. Let the laugh and noise cover all. How it works? Vibation and sound sensor board-response to any vibration or sound generated by both the users or the elevator itself. Enlightening carpet-Light sensor placed on top of the elevator gate,the carpet will automatically turn on when the gate opens,and off when close. Similar installtion inside the elevator is equlpped with pressure sensors that will locate any passenger with a focus light above the head. so to urge people to move their position instead of standing still.

Profolio

By collecting statistics of two typical user experience changes before and after the installation placement,we can notice,seemingly people are much more enlightened and enchanced.

Example1-people move to the centre of the elevator floor instead

of staying at a certain corner,trying to get the furthest distance from the other passengers. Meanwhile,people move to diffrent locations as well to just experience more about the installation.

Example2-after the installation placement,people talk more,laugh more,observe more,and,SING more!

Profolio

keywords about EHCO between

people and space

keywords about EHCO between

people and people

Easy or Uneasy

Material and people's feeling

Individual or Community

Private or Mutual

Faster or Slower Function or Fun

Profolio

keywords about EHCO between

space and space connect or Disconnect

keywords about EHCO between

space and space Vertical or Horizontal

Trade Centre Third CBD Sanlitun SOHO Shichahai

Galaxy SOHO

Forbidden City

Profolio

keywords about EHCO between

Space and Space Natural or Artificial

What are the ideal designs by Echoists?

OR The Great Wall

AND The Great City

Typical Hutong Area Faster Private

Natural Horizontal Slower

Vertical

Community

Artificial

MOMA Beijing

Individual Mutual

Sanlitun Village Wangjing SOHO (proposal)

Profolio

The Great City

Who are we as Echoists in the society? And how are we going to practice the echology methodology and make it a benefit for all mankind,the whole society,the nature and beyond? It's a question for us.

Some possibilities. -Private Elevators Interactive System -Vertical Hutong Complex/Community -Rooftop Community

Profolio

ZI ZHU IOS APP Development

Project Overview： This project is developed for ZiZhu Buddha Temple’ s promotion, and also aimed to provide their service to their public believers through APP. I took the responsibility for the interaction and visual design as the chief designer in this project. ZiZhu Buddha Temple has lots of believers as a famous ancient temple. Our team hope that through this application, allowing more kind-hearted people understand Zizhu Temple and Tibetan Buddhism, then allowing more people to accumulate practice.

Item type : Smart phone application development Time：In December 2011 - February 2012

We set up several main functions, such as “Praying” “Introduction” “Sutra Reading” “Videos”and“Registration”.Then we creatively use a“prayer wheel” which is an important instruments used in Tibetan Buddhism as a menu design elements. This system contains functions could help believers learn sutra and pray for them. These settings greatly enhance the chanting and praying experience for users. They also can learn sutra through online videos through this system. The“Introduction”part contains lots of information about ZiZhu temple.

Profolio

THE ROTATABLE DESIGN NAVIGATION DESIGN

"Prayer wheel" is an important instruments in Tibetan Buddhism, believers engraved the scripture onto it. Each rotation stands for the believers read the scripture for one time, pray for one more time. We use the element "prayer wheel" throughout the APP design. On the menu, the prayer wheel controls the selecting functions.In "sutra reading" section, prayer wheel works as the player of sutras. In the "Praying" mode, users can turn the "prayer wheel" by themselves in order to pray for themselves. This prayer wheel design is in a strict standard accordance with Tibetan Buddhist's standard. It inscribed with eight treasures of buddhism and ZiZhu Temple College Khenpo Zhacang's handwriting "five-word mantra."

Profolio

AN APP FOR BUDDHIST SERVICES This APP will give the world a better way to go about Zi Chu Temple

WELCOME TO USE

Zi Chu Temple is located in eastern Tibet's Chamdo region Zi Chu mountains, is one of the highest altitude monastery in Tibet, but also to teach Yong Chung of the oldest and one of the most important temples

Profolio

INTRODUCTION Introduction Zi Chu Temple location and history

DANCE A ritualdance performances by the monks of Tibetan Buddhism when held Puja celebrations

TREASURE Zi Chu Temple representative precious items

ACADEMY Introduces the Zi Chu Temple each school with its own feature

INTRODUCTION Practice accomplished, according to their own wishes and the reincarnation of people

TRAVEL Believer and a pious Hindus who worship ceremony

Profolio

INTERFACIAL DESIGN

Profolio

LIVE CLUB Interactive animation forpersonal promotion

Project Overview： This project is for a Junior level course of Central Academy of Fine Arts, the course name is“Personal promotion” . This course requires us to show our portfolio in a creative and interactive way. This course aims to help us show our works more creatively in the job market when we seek for opportunities after our graduation, it also helps us achieve a better promotion result.

Project Types：Interactive animation forpersonal promotion

Time：In March 2012 - in May 2012

The clue of my promotion interactive animation is about my personal experience, I use hand painting as the main form of expression, corresponding to different periods’works of mine. Audiences can click any symbols in the animation to review my portfolio.

Profolio

PERSONAL WORKS SHOW

VISUAL COMMUCATION

Profolio

LOGO DESIGN

Project Types：logo design

Project Overview：

Time：In September 2012 - September 2013

Here are several logos I created during my professional career, genres including tourist, banking, and electrical appliances.

Profolio

LOGO шо╛шоб

Profolio

CHINA AGRICULTUR Visual identity system manual

Project Overview： This VI system was created during my job, I participated in this project as main project leader. This logo was inspired by the shape of canola flower leaves. The sunshine stands for development. Four different colors represent agriculture, processing, chemicals and energy. Bright colors stand for positive. The use of multicolor shows the enterprise’ s diversity and diverse development.

Project Types：Visual identity system manual

The interlocking of the four graphics, predicts the enterprise’ s ability of overall control and coordinated development. The selection of blue font will bring an active but dignified feeling to the audiences.

Time：In January 2013 - March 2013

Profolio

VI DESIGN

Profolio

Macaron Brand Packing Design

Project Overviewďź&#x161; This is the graduation project. In this project, the package of Macaron, a classic French desert, is present in 3D. The idea comes from a foreign 3D poster. Given the informatization and diversification of modern society, print advertises become essential part of the culture of modern society. The presentation of print advertises keep changing as time goes by. Only taking advantage of print visual language is not enough for design. Given that, the graduation project breaks the traditional design methodology and 2D presentation, by using paper folding to present 3D objects. This innovation creates a new visual language, which is more expressive, attractive and strengthens the visual impact. It also brings the spectators to a touchable and 3D stage, from the traditional visual extension stage.

Project Typesďź&#x161;Brand Packing Design

The project consists of three posters, on which are baking time, materials and distribution of Macaron.

Timeďź&#x161;In March 2012 - June 2012

Profolio

HTC Poster Design

Project Overview： These posters are designed for HTC, CEB and several real estate companies.

Project Types：Poster Design

The posters for HTC display the advantages of cell phones produced by HTC, such as perfect audio, retina display and uniqueness, by three interesting copy writings, namely “Don’t show off!”, “Don’t play me!” and “Find fresh from nonfresh!”. The graphs of these posters consist of broken glasses and sisters. The glasses strengthen the visual impact, meanwhile the powerful comparison between sisters and laps of women with tattoo and high heels strengthen the uniqueness of HTC cell phones.

Time：In March 2012 - June 2012

Profolio

FAMOUS HOME Brand Planning

Project Overview： This is a personal project for“Dalian Furniture Market” . It includes pillar wraps, door tags, and glass tags and so on.

Project Types：Brand Planning Time：In September, 2013 - December 2013

This project summarizes distinctive graphs of furniture by using points, lines and panels. Points, lines and panels build up a strict print structure, which has strong sense of formation and abstraction. It is more general the technical compared with concrete presentation.

Profolio

CHARACTOR DESIGN Ilustration Design

Project Overview： This is a design course project in first half of my junior year. Theme of the first group is to recompose characters of a TV drama to comic characters. Based on the appearance of those characters, the new idea exaggerates their specialties.

Project Types：Ilustration Design Time：In March 2010 - in May 2010

Theme of the second group is character design of a TV game. It changes the features of insects to make them more vital. Tools: sketching for first step, Digital plate repairing figure for second step.

Profolio

102

103

Profolio

104

CAR Format Design

Project Types：Format Design Time：In September 2009 - October 2009

Project Overview： This a layout course project in first half of my sophomore year. This is a free style project, in which the vehicles and letters are showed by different layouts. It gives spectators visual feast.

Profolio

108

109

Profolio

110

MEN AND FRAGRANCE Photography

Project Types： Photography Model: classmatesFacility: Nikon D90

Time：In March 2011 - in May 2011

Project Overview： This is a photography course in second half of my junior year. Theme: “women and jeans”, “men and fragrance”.

Profolio

112

PERSONAL WORKS SHOW

VIDEO DESIGN

Profolio

116

VISUAL Visual propaganda film

Project Types：Premiere Pro Time：In January 2012 - March 2012

Project Overview： This is a video clipping course project in second half of my junior year. In this project, we make a VCR for students enrolling in video class as an advertisement. As a team member, I am in charge of clipping.

Profolio

118

119

Profolio

120

121

Profolio

Visual propaganda film

Profolio

122

DNA Adobe After Effects

Project Types：Adobe After Effects

Project Overview：

Time：In May 2011 - June 2011

This experience improves my video clipping skill, cooperation ability and familiarity with software like 3D, Premiere and AE.

Profolio

124

125

Profolio

126

DONGTING