MIX MEDIA DESIGN
Konkuk Univ. Communication Design Major.
Assignment Exhibition Work Book
-1-
1 / Syllabus
.............................. 4~11p
4 / Group Projects 4.1 Space
.............................. 224~525p 01. Easy in Mind 02. Another Place
2 / Programming Exercises
03. Break Yazak 04. The Sentimental Bench 05. Dreamscape
.............................. 12~17p
4.2 Object
01. Revenge Mouth 02. Sound Drawing 03. Cat in A Box 04. The Visible Blind
3 / Research
05 Horror & Fun
.............................. 18p~223p
4.3 App
01. Miniboot Camp 02. Zani 03. MeMap 04. KUMT
-2-
-3-
Mixed Media Design
Konkuk University. Fall. 2014 Course Description Class Hours : Wednesday 9am –1pm/ 2pm-6pm Instructor : Jihyun Kim Contact : jkim.class@gmail.com
Weekly classes will consist of two parts: Lecture / Workshop (1.5~2 hours) and Studio (2 hours activity-based labs).
Overview
Lecture/workshop sessions will cover human computer interaction related theory and interactive design process, usability testing methods. This class encourages using Processing as a way of realizing students’ projects; Basic processing usage is a prerequisite for this course. Advanced technical guidelines for your project will be provided.
This course is an introduction to holistic and heuristic concepts of mixed media, principles of human-centered design, and techniques of evaluation methods and executing usability tests through a plurality of media experience design–web/ mobile interfaces, data generation and visualization, physical computing, digital fabrication, and digital performance—within diverse contexts. This is not a class for developing programming or fragmentary design skills; rather this course aims to discover new possibilities and shape new forms that embrace real-world challenges with mixed media design.
Studio sessions will include in-class discussions, presentations and project reviews. This means that students should be able to describe and justify both their process and final project through classroom participations and activities. Studio projects include producing storyboard, wireframe, paper prototypes (low-fidelity), usability critiques, assessments of users' difficulties, iteration, and designs walk through. A final project provides functional prototypes (high-fidelity) with an in-depth plan for an actual application based on the previous projects conducted during the classes.
-4-
-5-
Mix Media Design
Mix Media Design
// Workshop
Mix Media Design
// Studio
a. IxD Process
a. Research (result: research & proposal)
01. Storyboard 02. Wireframe 03. Mock-up 04. Prototyping 05. Iteration 06. Walkthrough
b. Basic workshop 01. Hello processing 02. Variable, color and text 03. Hello Arduino 04. Media and animation 05. Interaction
01. Ideation 02. Impact of technology research 03. Proposal
b. Experience Design (result: interim report & prototype presentation) 01. Storyboard 02. Wireframe 03. Mock up 04. Interim report presentation
c. Usability Testing c. Advanced workshop 01. Vision and kinect -> projection mapping 02. Mobile (android) 03. Physical computing 04. Digital fabrication (3D printer) 05. Processing 3D
-6-
01. Prototyping 02. Usability Testing 03. Iteration & Walkthrough 04. Final report & documentation presentation 05. Critique
-7-
Mix Media Design
Course Materials
Class Note
Casey Reas and Ben Fry (Foreword by John Maeda). Processing: A Programming Handbook for Visual Designers and Artists Published August 2007, MIT Press. 736 pages. Hardcover.
This class takes in Korean for presentation and all materials and assignments will be in English.
Norman, Donald A. The Design of Everyday Things, Revised and Expanded Edition New. York: Basic Books (368 pgs) 2013, ISBN-13: 978-0465050659
Please make sure you keep your smart device usage to a minimum. It’s important to limit your mobile use to classrelated activities. Look ahead through all your deadlines. We have assignment dues almost every class period, and you'll need to make sure you don’t forget anything. You need to be proactive in this class in order to be on time and receive full credit for everything.
Mix Media Design
Online Materials Koyani, Sanjay J., Bailey, Robert W., and Nall, Janice R. Research-Based Web Design & Usability Guidelines, available free in book form or at http://www.usability.gov/guidelines/
Please contact me with any questions - my email address is on the front of the course syllabus. This syllabus is subjective to change after the first and second weeks.
Mix Media Design
Nielsen Norman (2010/2011) Reports of iPad usability http://www.nngroup.com/reports/ipad-app-andwebsite-usability/ Google Material Design Guideline http://www.google.com/design/spec/material-design/ introduction.html
-8-
-9-
Assignments
03 (10/22) : Novice tests and evaluation
Students will complete various assignments including exercises from workshops, studio process reports and presentations for their projects, as well as the final documentation of the project. Please note that late submissions will affect the grade.
Working in a group of 4 people, choose one application (either app or website) and conduct “benchmark tasks” with at least 5 novices. Record timings of novices while they are doing the tasks, and evaluate the application based on the times and occurred problems to novices. Create a presentation based on findings and recommendation.
01 (due 9/17, 9/24, 10/8, 10/15) : 4 programming exercises There will be simple programming exercises as workshops moves along. Specific dates and problems will be announced during week 2. 01. Upload http://www.openprocessing.org/classroom/4212 02 (09/1, 10/8) : research & proposal After the first week, students need to research five reference projects that are related to their project idea and related near future technologies. In addition to the research, students will prepare a brief project proposal presentation with a printed presentation file. 02. Upload Google Doc/ Presentation + .pdf file in class
03. Upload Dropbox/ Presentation 04 (11/28) : interim report & project prototype In this stage, students need to realize their project in the prototype level. Expected realization of students’ final project is a prototype developed with feasible technologies that will be discussed during the class. Printed interim reports will be collected and bounded together as a class book. Volunteer designers’ contribution is needed for it. 04. Presentation/ prototype & .pdf (or InDesign) file in class 05 (12/10, 12/17) : final installation & documentation For the final show of the semester, students are required to install their prototype on the exhibition site. Photo and video documentation of installed project is required for the final presentation. 05. Installation, Documentation Presentation
- 10 -
Mix Media Design
- 11 -
Mix Media Design
Assignment 01 - Morning Class
Mix Media Design
Assignment 01 - Afternoon Class
Mix Media Design
Assignment 01 Write a Processing sketch that recreates one of Kandinsky's works using 2D Primitives (rect, ellipse, triangle, quad, and/or arc) in a 600 x 600 pixel window.
- 12 -
- 13 -
Assignment 02 - Morning Class
Mix Media Design
Assignment 02 - Afternoon Class
Mix Media Design
Assignment 02 Create a drawing board with at least 6 buttons. Design an intuitive interface for the users, and before you start think how pleasurable the activity of drawing can be, and what kind of results you expect from the users. - 14 -
- 15 -
Assignment 03 - Morning Class
Mix Media Design
Assignment 03 - Afternoon Class
Mix Media Design
Assignment 03 Create one pattern with SIN/COS functions in a 600 x 600 pixel window. Save the image as “.pdf� file and add a title/word in your created pdf file. You should bring the pdf file on October 22.
- 16 -
- 17 -
Morning Class
Mix Media Design
Afternoon Class
Mix Media Design
Research We researched to create group project in the right way. - 18 -
- 19 -
Mix Media Design
Morning Class - Kang Yoojin.
Mix Media Design
Research We researched to create group project in the right way. - 20 -
- 21 -
Mix Media Design
Morning Class - Kang Yoojin.
Mix Media Design
Research We researched to create group project in the right way. - 22 -
- 23 -
Mix Media Design
Morning Class - Kang Jjwon.
Mix Media Design
Research We researched to create group project in the right way. - 24 -
- 25 -
Mix Media Design
Morning Class - Kang Jjwon.
Mix Media Design
Research We researched to create group project in the right way. - 26 -
- 27 -
Mix Media Design
Morning Class - Kang Jjwon.
Mix Media Design
Research We researched to create group project in the right way. - 28 -
- 29 -
Mix Media Design
Morning Class - Kang Jjwon.
Mix Media Design
Research We researched to create group project in the right way. - 30 -
- 31 -
Mix Media Design
Morning Class - Kwon Heisu.
Mix Media Design
Research We researched to create group project in the right way. - 32 -
- 33 -
Mix Media Design
Morning Class - Kwon Heisu.
Mix Media Design
Research We researched to create group project in the right way. - 34 -
- 35 -
Mix Media Design
Morning Class - Kim Kyungjoo.
Mix Media Design
Research We researched to create group project in the right way. - 36 -
- 37 -
Mix Media Design
Morning Class - Kim Kyungjoo.
Mix Media Design
Research We researched to create group project in the right way. - 38 -
- 39 -
Mix Media Design
Morning Class - Kim Dayeon.
Mix Media Design
Research We researched to create group project in the right way. - 40 -
- 41 -
Mix Media Design
Morning Class - Kim Dayeon.
Mix Media Design
Research We researched to create group project in the right way. - 42 -
- 43 -
Mix Media Design
Morning Class - Kim Dooyeon.
Mix Media Design
Research We researched to create group project in the right way. - 44 -
- 45 -
Mix Media Design
Morning Class - Kim Dooyeon.
Mix Media Design
Research We researched to create group project in the right way. - 46 -
- 47 -
Mix Media Design
Morning Class - Kim Jisu.
Mix Media Design
Research We researched to create group project in the right way. - 48 -
- 49 -
Mix Media Design
Morning Class - Kim Jisu.
Mix Media Design
Research We researched to create group project in the right way. - 50 -
- 51 -
Mix Media Design
Morning Class - Kim Jiyoung.
Mix Media Design
Research We researched to create group project in the right way. - 52 -
- 53 -
Mix Media Design
Morning Class - Kim Jiyoung.
Mix Media Design
Research We researched to create group project in the right way. - 54 -
- 55 -
Mix Media Design
Morning Class - Kim Chaemin.
Mix Media Design
Research We researched to create group project in the right way. - 56 -
- 57 -
Mix Media Design
Morning Class - Kim Chaemin.
Mix Media Design
Research We researched to create group project in the right way. - 58 -
- 59 -
Mix Media Design
Morning Class - Kim Chulki.
Mix Media Design
Research We researched to create group project in the right way. - 60 -
- 61 -
Mix Media Design
Morning Class - Kim Chulki.
Mix Media Design
Research We researched to create group project in the right way. - 62 -
- 63 -
Mix Media Design
Morning Class - Kim Hyemin.
Mix Media Design
Research We researched to create group project in the right way. - 64 -
- 65 -
Mix Media Design
Morning Class - Kim Hyemin.
Mix Media Design
Research We researched to create group project in the right way. - 66 -
- 67 -
Mix Media Design
Morning Class - Kim Hyeju.
Mix Media Design
Research We researched to create group project in the right way. - 68 -
- 69 -
Mix Media Design
Morning Class - Kim Hyeju.
Mix Media Design
Research We researched to create group project in the right way. - 70 -
- 71 -
Mix Media Design
Morning Class - Nam Kihwan.
Mix Media Design
Research We researched to create group project in the right way. - 72 -
- 73 -
Mix Media Design
Morning Class - Nam Kihwan.
Mix Media Design
Research We researched to create group project in the right way. - 74 -
- 75 -
Mix Media Design
Morning Class - Do Yujeong.
Mix Media Design
Research We researched to create group project in the right way. - 76 -
- 77 -
Mix Media Design
Morning Class - Do Yujeong.
Mix Media Design
Research We researched to create group project in the right way. - 78 -
- 79 -
Mix Media Design
Morning Class - Janis Rozenfelds.
Mix Media Design
Research We researched to create group project in the right way. - 80 -
- 81 -
Mix Media Design
Morning Class - Shin Jungin.
Mix Media Design
Research We researched to create group project in the right way. - 82 -
- 83 -
Mix Media Design
Morning Class - Yang soyeon.
Mix Media Design
Research We researched to create group project in the right way. - 84 -
- 85 -
Mix Media Design
Morning Class - Yang soyeon.
Mix Media Design
Research We researched to create group project in the right way. - 86 -
- 87 -
Mix Media Design
Morning Class - Yang Soyeon.
Mix Media Design
Research We researched to create group project in the right way. - 88 -
- 89 -
Mix Media Design
Morning Class - Carina Johansson.
Mix Media Design
Research We researched to create group project in the right way. - 90 -
- 91 -
Mix Media Design
Morning Class - Carina Johansson.
Mix Media Design
Research We researched to create group project in the right way. - 92 -
- 93 -
Mix Media Design
Morning Class - Halime Unvar.
Mix Media Design
Research We researched to create group project in the right way. - 94 -
- 95 -
Mix Media Design
Morning Class - Halime Unvar.
Mix Media Design
Research We researched to create group project in the right way. - 96 -
- 97 -
Mix Media Design
Morning Class - Yoon Seojin
Mix Media Design
Research We researched to create group project in the right way. - 98 -
- 99 -
Mix Media Design
Morning Class - Yoon Seojin
Mix Media Design
Research We researched to create group project in the right way. - 100 -
- 101 -
Mix Media Design
Morning Class - Lee Kyeongjin
Mix Media Design
Research We researched to create group project in the right way. - 102 -
- 103 -
Mix Media Design
Morning Class - Lee Kyeongjin
Mix Media Design
Research We researched to create group project in the right way. - 104 -
- 105 -
Mix Media Design
Morning Class - Lee Kwangho.
Mix Media Design
Research We researched to create group project in the right way. - 106 -
- 107 -
Mix Media Design
Morning Class - Lee Kwangho.
Mix Media Design
Research We researched to create group project in the right way. - 108 -
- 109 -
Mix Media Design
Morning Class - Lee Seungeun.
Mix Media Design
Research We researched to create group project in the right way. - 110 -
- 111 -
Mix Media Design
Morning Class - Lee Seungeun.
Mix Media Design
Research We researched to create group project in the right way. - 112 -
- 113 -
Mix Media Design
Morning Class - Lee Che Hyuk.
Mix Media Design
Research We researched to create group project in the right way. - 114 -
- 115 -
Mix Media Design
Morning Class - Lee Che Hyuk.
Mix Media Design
Research We researched to create group project in the right way. - 116 -
- 117 -
Mix Media Design
Morning Class - Lee Hyejin.
Mix Media Design
Research We researched to create group project in the right way. - 118 -
- 119 -
Mix Media Design
Morning Class - Lee Hyejin.
Mix Media Design
Research We researched to create group project in the right way. - 120 -
- 121 -
Mix Media Design
Morning Class - Joann.
Mix Media Design
Research We researched to create group project in the right way. - 122 -
- 123 -
Mix Media Design
Morning Class - Joann.
Mix Media Design
Research We researched to create group project in the right way. - 124 -
- 125 -
Mix Media Design
Morning Class - Jin Youngdu.
Mix Media Design
Research We researched to create group project in the right way. - 126 -
- 127 -
Mix Media Design
Morning Class - Jin Youngdu.
Mix Media Design
Research We researched to create group project in the right way. - 128 -
- 129 -
Mix Media Design
Morning Class - Choi Seulki.
Mix Media Design
Research We researched to create group project in the right way. - 130 -
- 131 -
Mix Media Design
Morning Class - Choi Seulki.
Mix Media Design
Research We researched to create group project in the right way. - 132 -
- 133 -
Afternoon Class - Kim Goeun.
Mix Media Design
Afternoon Class - Kim Goeun.
Mix Media Design
Research We researched to create group project in the right way. - 134 -
- 135 -
Afternoon Class - Kim Goeun.
Mix Media Design
Afternoon Class - Kim Nayoung.
Mix Media Design
Research We researched to create group project in the right way. - 136 -
- 137 -
Afternoon Class - Kim Nayoug.
Mix Media Design
Afternoon Class - Kim Nayoug.
Mix Media Design
Research We researched to create group project in the right way. - 138 -
- 139 -
Afternoon Class - Kim Bohyun.
Mix Media Design
Afternoon Class - Kim Bohyun.
Mix Media Design
Research We researched to create group project in the right way. - 140 -
- 141 -
Afternoon Class - Kim Bohyun.
Mix Media Design
Afternoon Class - Kim Sunyoung.
Mix Media Design
Research We researched to create group project in the right way. - 142 -
- 143 -
Afternoon Class - Kim Sunyoung.
Mix Media Design
Afternoon Class - Kim Sunyoung.
Mix Media Design
Research We researched to create group project in the right way. - 144 -
- 145 -
Afternoon Class - Kim Sungeun.
Mix Media Design
Afternoon Class - Kim Sungeun.
Mix Media Design
Research We researched to create group project in the right way. - 146 -
- 147 -
Afternoon Class - Kim Sungeun.
Mix Media Design
Afternoon Class - Kim Jina.
Mix Media Design
Research We researched to create group project in the right way. - 148 -
- 149 -
Afternoon Class - Kim Jina.
Mix Media Design
Afternoon Class - Kim Jihyeon.
Mix Media Design
Research We researched to create group project in the right way. - 150 -
- 151 -
Afternoon Class - Kim Jihyeon.
Mix Media Design
Afternoon Class - Kim Jihyeon.
Mix Media Design
Research We researched to create group project in the right way. - 152 -
- 153 -
Afternoon Class - Kim Hyunyeong.
Mix Media Design
Afternoon Class - Kim Hyunyeong.
Mix Media Design
Research We researched to create group project in the right way. - 154 -
- 155 -
Afternoon Class - Moon Jisun.
Mix Media Design
Afternoon Class - Moon Jisun.
Mix Media Design
Research We researched to create group project in the right way. - 156 -
- 157 -
Afternoon Class - Moon Jisun.
Mix Media Design
Afternoon Class - Park Goun.
Mix Media Design
Research We researched to create group project in the right way. - 158 -
- 159 -
Afternoon Class - Park Goun.
Mix Media Design
Afternoon Class - Park Goun.
Mix Media Design
Research We researched to create group project in the right way. - 160 -
- 161 -
Afternoon Class - Park leena.
Mix Media Design
Afternoon Class - Park leena.
Mix Media Design
Research We researched to create group project in the right way. - 162 -
- 163 -
Afternoon Class - Park leena.
Mix Media Design
Afternoon Class - Seo Jaeun.
Mix Media Design
Research We researched to create group project in the right way. - 164 -
- 165 -
Afternoon Class - Seo Jaeun.
Mix Media Design
Afternoon Class - Seo Jaeun.
Mix Media Design
Research We researched to create group project in the right way. - 166 -
- 167 -
Afternoon Class - Sung Eonhyeong.
Mix Media Design
Afternoon Class - Sung Eonhyeong.
Mix Media Design
Research We researched to create group project in the right way. - 168 -
- 169 -
Afternoon Class - Sung Eonhyeong.
Mix Media Design
Afternoon Class - Yeom Jiwon.
Mix Media Design
Research We researched to create group project in the right way. - 170 -
- 171 -
Afternoon Class - Yeom Jiwon.
Mix Media Design
Afternoon Class - Yeom Jiwon.
Mix Media Design
Research We researched to create group project in the right way. - 172 -
- 173 -
Afternoon Class - Yoo Ga.
Mix Media Design
Afternoon Class - Yoo Ga.
Mix Media Design
Research We researched to create group project in the right way. - 174 -
- 175 -
Afternoon Class - Yoo Ga.
Mix Media Design
Afternoon Class - Yun Minji
Mix Media Design
Research We researched to create group project in the right way. - 176 -
- 177 -
Afternoon Class - Yun Minji.
Mix Media Design
Afternoon Class - Yun Minji.
Mix Media Design
Research We researched to create group project in the right way. - 178 -
- 179 -
Afternoon Class - Yoon Sungwoo.
Mix Media Design
Afternoon Class - Yoon Sungwoo.
Mix Media Design
Research We researched to create group project in the right way. - 180 -
- 181 -
Afternoon Class - Yun Heeyeon.
Mix Media Design
Afternoon Class - Yun Heeyeon.
Mix Media Design
Research We researched to create group project in the right way. - 182 -
- 183 -
Afternoon Class - Yun Heeyeon.
Mix Media Design
Afternoon Class - Lee Daeun.
Mix Media Design
Research We researched to create group project in the right way. - 184 -
- 185 -
Afternoon Class - Lee Daeun.
Mix Media Design
Afternoon Class - Lee Daeun.
Mix Media Design
Research We researched to create group project in the right way. - 186 -
- 187 -
Afternoon Class - Lee Boram.
Mix Media Design
Afternoon Class - Lee Boram.
Mix Media Design
Research We researched to create group project in the right way. - 188 -
- 189 -
Afternoon Class - Lee Boram.
Mix Media Design
Afternoon Class - Lee Songah.
Mix Media Design
Research We researched to create group project in the right way. - 190 -
- 191 -
Afternoon Class - Lee Songah.
Mix Media Design
Afternoon Class - Lee Songah.
Mix Media Design
Research We researched to create group project in the right way. - 192 -
- 193 -
Afternoon Class - Lee Yeonsun.
Mix Media Design
Afternoon Class - Lee Yeonsun.
Mix Media Design
Research We researched to create group project in the right way. - 194 -
- 195 -
Afternoon Class - Lee Yeonsun.
Mix Media Design
Afternoon Class - Lee Yumi.
Mix Media Design
Research We researched to create group project in the right way. - 196 -
- 197 -
Afternoon Class - Lee Yumi.
Mix Media Design
Afternoon Class - Lee Yumi.
Mix Media Design
Research We researched to create group project in the right way. - 198 -
- 199 -
Afternoon Class - Lee Yoonju.
Mix Media Design
Afternoon Class - Lee Yoonju.
Mix Media Design
Research We researched to create group project in the right way. - 200 -
- 201 -
Afternoon Class - Lee Yoonju.
Mix Media Design
Afternoon Class - Lee Eunsil.
Mix Media Design
Research We researched to create group project in the right way. - 202 -
- 203 -
Afternoon Class - Lee Eunsil.
Mix Media Design
Afternoon Class - Lee Eunsil.
Mix Media Design
Research We researched to create group project in the right way. - 204 -
- 205 -
Afternoon Class - Lee Eunsil.
Mix Media Design
Afternoon Class - Lee Eunsil.
Mix Media Design
Research We researched to create group project in the right way. - 206 -
- 207 -
Afternoon Class - Lee Eunsil.
Mix Media Design
Afternoon Class - Lee Jaeok.
Mix Media Design
Research We researched to create group project in the right way. - 208 -
- 209 -
Afternoon Class - Lee Jaeok.
Mix Media Design
Afternoon Class - Lee Jaeok.
Mix Media Design
Research We researched to create group project in the right way. - 210 -
- 211 -
Afternoon Class - Jung Karam.
Mix Media Design
Afternoon Class - Jung Karam.
Mix Media Design
Research We researched to create group project in the right way. - 212 -
- 213 -
Afternoon Class - Jung Karam.
Mix Media Design
Afternoon Class - Jeong Byeongjun.
Mix Media Design
Research We researched to create group project in the right way. - 214 -
- 215 -
Afternoon Class - Jeong Byeongjun.
Mix Media Design
Afternoon Class - Jeong Byeongjun.
Mix Media Design
Research We researched to create group project in the right way. - 216 -
- 217 -
Afternoon Class - Choi Suji.
Mix Media Design
Afternoon Class - Choi Suji.
Mix Media Design
Research We researched to create group project in the right way. - 218 -
- 219 -
Afternoon Class - Choi Suji.
Mix Media Design
Afternoon Class - Tang Yingsui.
Mix Media Design
Research We researched to create group project in the right way. - 220 -
- 221 -
Afternoon Class - Tang Yingsui.
Mix Media Design
Afternoon Class - Tang Yingsui.
Mix Media Design
Research We researched to create group project in the right way. - 222 -
- 223 -
- 224 -
Pr ou oj p ec t
Gr
4.1
Space 1. Easy In Mind 2. Another Place 3. Break Yazak 4. The Sentimental Bench 5. Dreamscape
- 225 -
Jin young du
Kang ji won
d
min
in
easy
Lee kwang ho
Kim cheol ki
Kim hye ju
- 226 - 227 -
Overview
Kim hye ju
Our Members.
Title
easy in mind
Categories
Projection Mapping
Concept & Goal
Concept
Jin young du Kim cheol ki Lee kwang ho Kang ji won
m
the projection mapping. Goal
in
sy ea
in
d
Leads moods through
Ease a person´s mind who walking in a dark alley alone.
Expected User
the person walking in
Overview
a dark alley alone.
- 228 -
- 229 -
Start Projection
m
Projector
Detected!!!
Sensor
Here is a user who filled fear.
User turns in the alley.
User turns in the alley.
-
-
Sensor detects a user. and projector begin to work.
User watches the playing images.
User watches the playing images.
User is out of alley, and keep go on.
and user will be getting relax.
and user will be getting relax.
â—?
playing image
â—?
Finally, End projection. Playing images.
Flow
User Scenario
User Scenario & Flow
in
sy ea
in
d
Sensor
- 230 -
The sensor detects that the user is leaving. and then projector stop playing images. - 231 -
- 232 - 233 -
Contents Map / Plan d in
m
in
sy ea
m
Prototyping
in
sy ea
in
d
Prototyping
- 234 -
- 235 -
Edited images of cute and friendly characters.
m
Visual Design
in
sy ea
in
d
Video 1
#1
#2
#3
#4
#5
#6
#7
#8
- 236 -
- 237 -
Edited images of exciting and active situation.
m
Visual Design
in
sy ea
in
d
Video 2
#1
#2
#3
#4
#5
#6
#7
#8
- 238 -
- 239 -
Edited images of relax and peaceful nature.
m
Visual Design
in
sy ea
in
d
Video 3
#1
#2
#3
#4
#5
#6
#7
#8
- 240 -
- 241 -
m
in
sy ea
in
d
2. side view suitable location
A
B
Installation Plan
user
1. View from above - 242 -
Distant Sencor + Arduino + Bluetooth Module
Mini Beam + Mac Book
- 243 -
1) Detection of the sensor Who passes in front of the sensor, the sensor detects the distance.
1)
m
Technical Structure - Diagram
in
sy ea
in
d
How it works this projects
2) Work If the sensor is transmitted to measure the distance to the Arduino, PC, and sends the distance again from the Arduino to the processing. If this distance is less than a certain distance,to play back the video was stopped.
2)
3)
3) Playing an moving image Plays an moving image for a pre- determined time. and loops this process. - 244 -
- 245 -
d m
in
Storyboard
in
sy ea
#1
#4
#2
#5
#3
#6
- 246 -
- 247 -
Janis Rozenfelds
Kim JiSoo
Nam KiHwan
Yoon SeoJin
- 248 - 249 -
Overview
Yoon SeoJin
Our Members.
Title
Another Place
Categories
Installation
Concept & Goal
Concept
Nam KiHwan Kim JiSoo JanisRozenfelds
Redesign the elevator so that people can feel like standing in another place Goal Help to reduce their stress and enjoy the moment that they are in the elevator
Expected User
People who are using elevator and usually have a stress
Form Factor
Place- Elevator Contents- 3videos that show
other places
Video01- Travel to other country
show their everydaylife
Overview
Video02- Universe(dark,galaxy) Video03- scientific situation
- 250 -
- 251 -
(Cell division)
User Scenario
1. Wating the elevator he got a stress 2. He touch the down button 3. Elevator is arrived 4. Open the elevator door
1
2
3
4
5. He's in another space
User Scenario & Flow
Flow
- 252 -
5
- 253 -
Take the elevator Movingthe elevator sound, movie change
Time(sec)
People release the stress
Contents Map / Plan
Movingthe elevator sound, movie change
- 254 -
- 255 -
Time(sec)
skin
cell division
crush it to pieces
blood blood vessel bone fun dynamic crazy
spain england japan
In a cafe to drink. In a cafe to talk. take a walk in a park shopping
festival
color
Body
Travel
red skin color black
Amazing of the human body
everyday life
Combine the body and science.
Another Place
Contents Map / Plan
The place that cannot feel in the elevator and release stress.
dot line side
music repetitive crackled
0,1
silver grass grove
warm mood
electronic
Science
Nature
water
binary system Universe
- 256 -
tremble in the breeze sound of grass
sea water drop (water) vapor condensation dark galaxy cosmos - 257 -
dreamlike
skin
fun dynamic crazy
spain england japan
In a cafe to drink. In a cafe to talk. take a walk in a park shopping
1
festival
cell division
blood blood vessel bone color color
Body
Travel
crush it to pieces
If someone touch the screen some elements are copied.
red (or cells colors are changed.) skin color black we want to express cell division.
Amazing of the human body
everyday life
Interactive elements
Another Place
Contents Map / Plan
The place that cannot feel in the elevator and release stress.
dot line side
music repetitive crackled
0,1
- 258 -
silver grass grove
tremble in the breeze sound of grass warm mood
electronic
Science binary system
Nature
2
water
sea water drop (water) vapor condensation If someone touch the screen some graphics are changed.
Universe Universe
dark dreamlike simple graphics galaxy ex) triangle, circle, square. cosmos - 259 -
Wireframe
The door is open our movie and sound playing reaptedly
Wire frame
and that change by time(sec.)
- 260 -
- 261 -
Prototyping
Help to reduce their stress and feel the another space
Prototyping
We made 6type ot the video
- 262 -
- 263 -
Prototyping
Help to reduce their stress and feel the another space
Prototyping
We made 6type ot the video
- 264 -
- 265 -
Visual Design
Simulation1
Visual Design
Simulation2
- 266 -
- 267 -
Visual Design
Simulation3
Visual Design
Simulation4
- 268 -
- 269 -
Visual Design
Real1
Our videos are in omnibus format.
We choose one subjcet that people release their stress and show our goal through the 4type of videos.
Visual Design
Real2
- 270 -
- 271 -
Visual Design
Real3
Our videos are in omnibus format.
We choose one subjcet that people release their stress and show our goal through the
Visual Design
3type of videos.
- 272 -
- 273 -
Visual Design
Test our project. Test1
Visual Design
Test2
- 274 -
- 275 -
Installarion Plan
First, we installation in real elevator. and then we shoot the guide video (how people can use it). 912mm Second, we installation the our project in a big box. and show our video by the computer monitor.(projector has a problem 4type of our video. 21inch monitor
with our situation) and we show the people the guide video that before the entrance.
1785mm
9inch
Installation Plan
ipad
we show another video that happen in real elevator so that people know how the elevator can be work.
- 276 -
- 277 -
Contents Map / Plan
Create the circle
Making section to
Recognize the
Reaction of
recognize changes
change of the color
the circle
1.
3.
Automatical creation of the circle with reference that
Detect the change of the color.
named "random", we need radius, coordinate, color.
*Extract the color: after analyze the RGB's figure and
get the datas, and interconrert it as a RGB again..
A circle will appear at random
*Compater the color: extracted figure of the color in the new scene and the original. 2.
If the extracted figure over the standard,
Set the sensible section. To improve the speed od the
recognize it as a change.
Technical Structure - Diagram
processing, we need to set the section inside the circle.
4. The way the circle react. *When the extracted figure over the standard, the circle ecognize it as a chabge. *If the changes are recognized, the circle will twinkle.
- 278 -
- 279 -
1.Travel 1.Travel
-A dark night
2.Body
-students who finished the class -waiting the elevator -Press the button -Elevator comes& students backsde view -Videos and musics play - Students feel happy
-The moment meeting new world : Another Place
2.Body - tired students - He/She waits for the elevator - Press the button - Elevator comes, student's backside view - Videos and music play
Storyboard
- Student feel happy
-The moment meeting new world : Another Place
- 280 -
- 281 -
3. Nature - the alarm clock ringing
3.Nature
- Student who lates his/her class running - He/She takes the elevator barely - He/She press the button - Videos and music play - He/She surprised
-The moment meeting new world
Storyboard
: Another Place
- 282 -
- 283 -
- 284 - 285 -
Kim Go-eun
Park Lee-na
Jung Ga-ram
Lee Da-eun
Overview
Lee Da-eun
Our Members.
Title
Break YAZAK
Categories
Interactive Media
Concept & Goal
Concept
Jung Ga-ram Park Lee-na Kim Go-eun
Vending machine and breaktime.
Goal To provide enjoyment for people who are tired.
People who are tired for doing Expected User
work at night.
- Vending Machine Size Form Factor
181 X 107 cm - A Coin Slot Size 11 X 16 cm - A Drink Outlet Size
Overview
17.5 X 80 cm
- 286 -
- 287 -
User Scenario
Walks over to the vending machine.
Insert a coin, Select beverage.
See the user to go back and get a drink cans.
When approaching to vending machine the pictures are taken within 50cm.
White booth behined bring up his(or her) face and uptake. (TV program Theme)
User Scenario & Flow
Flow
The sensor detects the distance. (Distance between the vending machine and user.)
- 288 -
- 289 -
Enjoyed and Impressed.
<MONITER & BEAM PROJECT> Go to the vending machine.
Distance Sensor wating.
Close to 50cm from the vending machine.
Sensor operating.
Standing(choose the drink or insert coin).
Face tracking during 2seconds.
Blank image.
Camera view Camera operating.
Contents Map / Plan
Photo is taken.
pop up.
Capture with TV decoration. Take out and drink.
Look Back. FUN & LAUGH.
- 290 -
The music turns on.
The tooken picture on the boose wall.
- 291 -
Wireframe <Parody visual>
1. User comes to vending machines.
2. The sensor detect the distance. (x < 50cm)
3. When the user approaches the vending
Wire frame
machine, camera takes pictures.
4. The user looks back.
5. The user can see their photo with TV program parody visual.
- 292 -
- 293 -
- First Prototyping
Prototyping
Prototyping
- 294 -
- 295 -
- Vending Machine Mock-up, install the Arduino.
Prototyping
Prototyping
- 296 -
- 297 -
Visual Design
- <Human Theater> Visual.
- <Running Man>Visual.
Visual Design
- <It wants to know> Visual.
- 298 -
- 299 -
Visual Design
- <Human Theater> Visual.
- <Running Man>Visual.
Visual Design
- <It wants to know> Visual.
- 300 -
- 301 -
Installation Plan
Installarion Plan
- 302 -
- 303 -
< NOTES equipment >
1. Distance Sensor [ GP2Y0A21YK ]
Sensors to detect the distance using the infrared.
2. Web Cam
Technical Structure - Diagram
[ Logitec ]
<ARDUINO > with Distance Sensor [GP2Y0A21YK] It senser the people who close to 50cm from the vending machine send serial.write (1)
- 304 -
otherwise
<PROCESSING > 1. face tracking after 2seconds
2. capture with TV decoration 3. The tooken picture on the moniter and music start
Recognize a face and a webcam that a traffic logging.
send serial.write (0)
- 305 -
1. They are doing their assignment. 1. They arrived the third floor.
2. And use a vending machine.
3. Take out the drinks. And look back.
4. There is funny situation is directing with her photograph taken immediately.
5. All her friends laugh to see it.
6. She also seems to enjoy.
2. They looks very stressed today. “LET’S GO TO THE THIRD FLOOR.”
3. Someone suggests to them.
Storyboard
exit
4. They get up from their seats and go to the third floor. - 306 -
- 307 -
201212733 Choi Suji
201212721 Lee Jeaok
201212711 Moon Jisun
201012700 Yun Minji
- 308 - 309 -
201012700 Yun Minji
Our Members.
Overview
Title
The Sentimental Bench
Categories
Physical Computing
Concept & Goal
Concept
201212711 Moon Jisun 201212721 Lee Jaeok 201212733 Choi Suji
Unexpected Goal Providing people with emotional and sentimental experience
Expected User
People who get tired of their everyday lives
Overview
Form Factor
- 310 -
- 311 -
A form to sit on a park bench
User Scenario
A person walks to the bench
Then he sits on the bench
When 10 minutes passed after he sat,
The sound of camera shutter is played
User Scenario & Flow
Then the video begins playing
Sitting time
Flow
1 min 1:30
A sensor detects the person
- 312 -
Play sound effect & Video begins playing
- 313 -
<Contents Map>
Results from Survey
<Plan>
Good job
Introduction:
I believe in you
Sound effects start
It’s okay as it is
The video on the Polaroid falls on the ground
I love you
The video fades in on the Polaroid
I miss you > Words on the Polaroid
Body: A video of love and emotion for 20 seconds
Sound Effect
Camera Shutter, A printer,
Uplifting words on the video
Receipt printing
Words are going to be written as the video plays “We support you,” “We cheer for you,” “We will be there for you”
Font
Handwriting,
Contents Map / Plan
Align Centre, On the video
Conclusion: A black background with our logo on it.
Leigh of the Video
- 314 -
Leigh of the Video: 20 seconds
The whole Polaroid fades out
- 315 -
Wireframe
A sentimental video playing
A polaroid image Fade in when the video starts Fade out when it ends
Handwriting texts Starts to write in the middle of the video
Slides upward
Wire frame
When the project starts, the polaroid slides up on the screen with the camera sound.
- 316 -
- 317 -
Prototyping
Prototyping
- 318 -
- 319 -
Visual Design
1.
2.
3.
when the polaroid slides upwards.
visual image is when the video
After the video ends, the logo of our
actually plays.
project will appear on the secreen.
( Details of old polaroid )
Visual Design
( Fade in and out )
- 320 -
- 321 -
Outdoor Display type
Side View
Indoor Display Type
projection
mini projecter sensor
Front View (Indoor Display) projection
155 cm
sensor
Installation Plan
40 cm
sensor
85 cm
Front View (Outdoor Display) projection
sensor
- 322 -
- 323 -
arduino
distance sensor
processing
arduino UNO
Arduino.value is received
The analog signals are received by a distance sensor, and they are computed to either '0'
value = 1?
or '1' in Arduino. Then
yes
100cm이내 물체감지
no
Time checking start
no
to Processing. When the
movie.stop
signal is '1', Processing starts checking time. If 10 seconds pass, the video
yes no
value 1
Arduino sends the values
value 0
starts. Several videos will
10s passed?
be playing in order.
yes
When the signal is '0', it
Technical Structure - Diagram
doesn't play.
movie.play
no
Is movie over? yes preparing next video
- 324 -
- 325 -
A sunrise at the Lake Ilgamho.
Below the knee shot of the bench
The very front view of the bench.
(There are people passing by the bench)
People are walking down the street.
A closer shot of the bench
The person stops by the bench.
Storyboard
(There are people passing by the bench)
A camera shot of the bench from far away.
A shot of a person around
A shot of person sitting down
(There are people passing by the bench)
the Lake Ilgamho.
but her face is not shown.
- 326 -
- 327 -
Storyboard
She sits down at the bench with
She looks around as if
She stands up and walks away.
a very tired face and the pose.
someone is palying a prank on her.
The Sentimental Bench starts to play,
As the video plays, a close shot
and she seems very astonished.
of the video will be playing.
A long shot of the Sentimental Bench
After the video, her heart is touched.
Ending credit
playing the project. - 328 -
A clip of how we have installed all the project.
- 329 -
Yujeong Do Halime Unvar
Jiyoung Kim
Kyoungjii Kim
Yoojin Kang
- 330 - 331 -
Our Members.
Yoojin Kang
Title
DREAMSCAPE
Categories
App to people get out of reality
Concept & Goal
Concept
Kyoungjii Kim
Jiyoung Kim
Overview
Yujeong Do
Surreal experience Goal make it easier for people to feel surreal
Expected User
people who have problem to relax of their work
Overview
Form Factor
- 332 -
- 333 -
App
1. Click the app.
2. Click the icon.
3. Click on the image.
4. Control the size, volume, opacity.
5. Send the settings to the beam by sliding wherever the person wants.
User Scenario & Flow
6. Enjoy the dreamscape.
7. Shake the phone.
- 334 -
- 335 -
Intro
Menu
Main
Category Play now
Contents Map / Plan
Settings
Sliding
- 336 -
App Click
Modify
Delete
Random
Favorite
Like
App Click
Modify
- 337 -
Delete
Yes
No
1
4
2 ThemeIcon
ThemeIcon
Beam Projector
Sub Menu
ThemeIcon ThemeIcon
Sliding to
Video Video
DREAMSCAPE
Favorites
Dreamscape ThemeIcon
Play Now Icon Favorites Icon
Random Icon
3 1 Video
Video
Play Now
Wire frame
Video Video Video
2-2
Video
Video
Do you want to play random?
Video
Video Yes
No
Video
2-1 - 338 -
- 339 -
2-3
We installed our prototype in a smart phone and concluded that we should develop more our application accordance
Prototyping
to our concept.
- 340 -
- 341 -
We used blue and green as main colors. Also, we used various graphic elements to convey
Visual Design
surreal atmosphere.
- 342 -
- 343 -
The user can play the videos on a Beam Projectiorby using application.
Installation Plan
2m
The user hold mobile.
- 344 -
- 345 -
Processing Functions/Variables/Libraries we used:
Library: video
It makes processing possible
to import videos and play them
Time: millis()
It helps set the amount of time
to move to the next page
Technical Structure - Diagram
Conditionals: if, else if
These codes allow to put conditions on something
Function: mousePressed
It works every time the mouse is pressed
- 346 -
- 347 -
Storyboard
- 348 -
- 349 -
4.2
Object 1. Revenge Mouth 2. Sound Drawing 3. Cat In A Box 4. The Visible Blind 5. .Horror & Fun
- 350 -
- 351 -
- 352 - 353 -
Kim Hyeonyoung
Jung Byeongjun
Lee Yoonju
Kim Nayoung
Nayoung Kim
Our Members.
Overview
Revenge Mouth
Hyeonyeong Kim
Yoonju Lee
Byeongjun Jeong Concept Our project is an interactive work using sound sensors.
Goal We want to silence who are noisy in the elevator through the Revenge Mouth.
Expected User People who do not bother other people in elevator on purpose
Form factor Speaker: 65 x 65 x 235 (mm) Visualizing: 130 x 130 x 370
Overview
(mm)
- 354 -
- 355 -
User Scenario & Flow
We can experience so many situations in the elevator, 1)
and sometimes several students
People talking in
say or laugh too loudly,
elevator
but we usually cannot say â&#x20AC;&#x153;Be quite, please.â&#x20AC;? to them. And the moving time of the 2)
Some sound sources
elevator is short.
are played at the
So we choose the elevator in our school building
speaker.
to our installation place.
3)
People hear that.
4)
People reacts by sound
User Scenario & Flow
sources.
5)
- 356 -
So they became quiet.
- 357 -
An interactive work which
An average decibel in our daily
generates some sounds
life
when it catch a loud noise(a
= 40~80 decibel.
sound level of 75 decibels).
An average decibel when we talk
It was contrived for people who
= 60 decibel.
seem to bear the noise.
An average decibel in a concert
Revenge Mouth will make them
of rock band
be quite instead of you.
= 110 decibel.
But, the sound made by Revenge Mouth will be interesting and enjoyable
Contents Map / Plan
because of its uniqueness.
- 358 -
- 359 -
Prototyping
Prototyping
- 360 -
- 361 -
Visual Design
Visual Design
- 362 -
- 363 -
Installarion Plan
Use Battery (of Arduino) to power on
We buyed a sound sensor, because there is no sensor in Arduino Kit in the school.
No Camera(We'll use it only to record the work)
Installation Plan
Sensor: Sound sensor Output Device: peaker Installation Place: Elevator in our school building Variable: Noise more than 75 decibel
- 364 -
- 365 -
Technical Structure/Diagram
We use the battery powered speaker, sound sensor and Arduino kit.
Arduino will work by 9v battery.
Sensor will be powered by Arduino.
Technical Structure - Diagram
Speaker will be powered by itself.
- 366 -
- 367 -
1) The elevator is open 2) The main character is surrounded by noisy people. 3) Close-up his angry face. 4) Their appearance from behind and more noisier sounds. 5) Repetition more and more noisy sounds and his angry face 6) Sounds of 'Revenge Mouth' and silence. 7) Surprised and embarrased people 8) The elevator is stopped.
Storyboard
9) Close-up 'Revenge Mouth'.
- 368 -
- 369 -
- 370 - 371 -
SOREN
LEE KYUNG JIN
LEE CHE HYUK
YANG SO YEON
KIM HYE MIN
KIM HYE MIN
Our Members.
Title
Sound Drawing
Categories
Object
Concept & Goal
Providing creative experience to
YANG SO YEON LEE CHE HYUK LEE KYUNG JIN SOREN
children
Expected User
Children and Parents
User Example
User A Age : 42 He has personal mobile phone and computer He does not enjoy the game actually Children - 9 years old , 7 years old
User B Age : 9 She never ever used a cell phone or played mobile games (pc games
Overview
also)
Use 70x70x20 wood tray Form Factor
- 372 -
- 373 -
Display drawings on the wall
User Scenario
User Scenario & Flow
Flow
- 374 -
- 375 -
The number of motors : 3~4
Drawing Tools : thread, brush, ink, crayon, etc....
Place : kindergarten,
Contents Map / Plan
playground
- 376 -
- 377 -
Prototyping
Prototyping
- 378 -
- 379 -
Prototyping
Prototyping
- 380 -
- 381 -
Prototyping
Prototyping
- 382 -
- 383 -
Visual Design
Visual Design
- 384 -
- 385 -
Installation Plan
Installarion Plan
- 386 -
- 387 -
Contents Map / Plan
Sound Sensor YS2200 X 2
Servo motor SG90 X 4 MG995 X2 Music
Voice
Sound sensor
Mic
Technical Structure - Diagram
Mic
Servomotor
- 388 -
- 389 -
Show making film and
Storyboard
users, detail of gadget.
- 390 -
- 391 -
Choi Sul gi
Lee Hei Jin
Sin Jung In
Kwon Hei Su
- 392 - 393 -
Kwon Hei Su
Our Members.
Overview
Title
Cat in the box
Categories
Interaction device
Concept & Goal
Concept
Sin Jung In Lee Hei Jin Choi Sul Gi
Make a playing box for cat
Expected User
Circumstances the owner does not play a direct
Overview
Form Factor
- 394 -
- 395 -
Cat test, Research
User Scenario
People Experience
Contents
1 - Their cats boder them.
1 - â&#x20AC;&#x153;Cat in a boxâ&#x20AC;?
2 - Turn on the box.
2 - Cat does not boder them.
Flow
Cat
User Scenario & Flow
Experience
Contents
1 - Take interest in the box
1 - Blinking LED bulbs.
2 - Approach the box
2 - LED bulbs are turned off
3 - Put thier haeds in the box.
4 - Come into the box
3 - Visual catnip is played.
4 - Visual catnip keep played.
- Blubs blink getting faster. - 396 -
- 397 -
Setting the box
Cat take an interest in the box
Cat approach the box. Aprroach within 1m.
LED bulbs blink per 3 second
5~7 second passed.
Aprroach within 50cm.
LED bulbs blink per 1 second
Cat stare the screen about 10 second.
Contents Map / Plan
Aprroach within 10cm.
- 398 -
Cat put his or her haed into the box
LED bulbs blink per 0.5 second
LED bulbs are turned off Screen turned on and visual catnip is palyed.
Cat stay in the box
- 399 -
Visual catnip keep played.
Wire frame
Wireframe
- 400 -
- 401 -
Prototyping
Prototyping
video
- 402 -
- 403 -
Visual Design
Another entrance (box identity)
Visual Design
Display
Hardware(inside) (Power, Board, etc) LED lamps
- 404 -
Entrance
- 405 -
Installarion Plan
In a corner or dark space that cat feels comfortable
Installation Plan
(ex.besides sofa,under bed.etc)
- 406 -
- 407 -
Technical Structure - Diagram
Contents Map / Plan
- 408 -
- 409 -
Storyboard
- 410 -
- 411 -
Youngsu Tang
Yumi Lee
Jiwon Yeom Heeyeon Yun
Goun Park
- 412 - 413 -
Overview
Goun Park
Our Members.
Jiwon Yeom
blah blah
The Visible Blind Categories
Heeyeon Yun Yumi Lee Youngsu Tang
Title
blah blah
Object & Output Display Concept & Goal
Concept
Braille for visible people helps to
Our concept is Braille for visible
sympathize the blind
people to sympathize the blind. Goal Try to understand Braille , sympathize the blind and feel what they feel.
Expected User People who aren't the blind
Overview
Form Factor
- 414 -
- 415 -
User Scenario & Flow
User Scenario
First, person come in the smallblack room and see the Braille made by the wood. Person who see the Braille swipes the Braille, and Braille's light is changed. Light sensor is installed
Wood
with led, so person touch the Braille, light sensor send serial
See the Braille On the Wood
▶
Swipe the Braille
▶
Light color is changed
Flow
Monitor
User Scenario & Flow
▶
- 416 -
Sound & Graphic Output
- 417 -
to Processing, then Processing receives serial and output the video with sound explaining about Braille.
Wood Braille book is connected with beam projector, so touch the braille, video output on screen is
Contents Map / Plan
appeared.
- 418 -
- 419 -
Wireframe
Wood Braille boad is installed with screen connected with computer. Input to the Braille, and output to the screen.
색으로 칠해진 부분에 해당하는 그래픽 및 사운드 (분수처럼 / 흩어지는 / 푸른 / 종소리) ㅂ 운
ㅅ ㅜ
ㅎ
ㅡ
ㅌ
ㅓ
ㅍ
ㅜ
ㄹ
은
ㅈ
옹
ㅅ
ㅈ
ㄹ
ㅣ
ㄹ ㅓ
ㄴ 은
ㅣ
Wire frame
ㅗ
ㅊ ㅓ
- 420 -
- 421 -
ㅁ
Prototyping
In the dark room, one girl comes in and find the Braille. She walk to the Braille and check the light from the Braille. She touch Braille and see the video in screen explaining the meaning of Braille.
Prototyping
She see it and try to feel it.
- 422 -
- 423 -
Visual Design
Our visual design is pattern made by water. Water's different motions try to explain the Braille's meaning superrationally. And wood board stimulate people's sense and give
Visual Design
comfortalble image.
- 424 -
- 425 -
Installarion Plan
Connecy screen and Braille to the computer. And in the wood board, 4 yellow LED and 4 blue LED are in. Each blue and yellow LED is connected to CDS on the bread board. CDS's input is changed yellow LED change to blue LED. And video output to screen because of serial number
Installation Plan
sent by arduino.
- 426 -
- 427 -
Contents Map / Plan
Same as previous page. Arduino code is about CDS number and reacts with LEDs. And processing's code is about importing serial from arduino and playing the video based on serial
Technical Structure - Diagram
number.
- 428 -
- 429 -
Girl come in and see the Braille. She swipes it and yellow light color change to blue. And then, video is played. She watch it and
Storyboard
surprised, try to feel it.
- 430 -
- 431 -
JO EUN BI
CARINA
LEE SEUNG EUN
GO I HAE
- 432 - 433 -
Overview
GO I HAE
Our Members.
Title
Horror & Fun
Categories
Interactive Display
Concept & Goal
Concept
JO EUN BI LEE SEUNG EUN CARINA
Unexpected fun experience
Goal As Konkuk Univ. Students we want to let them experience unexpected actions such as pop ups and loud sounds so that in their daily lives have a bit more fun.
Student who use IMac in 802
Form Factor
802 IMac
Overview
Expected User
- 434 -
- 435 -
User Scenario Target A enter 802 to use IMac for class or assignment Target A sit in front of IMac scenario1 : black screen -> break screen & ghost scenario2 : ghost coming out-> emoticon scenario3 : skeleton(scary sound) -> giggling scenario4 : ghost movie clip
User Scenario & Flow
Flow
- 436 -
- 437 -
Contents Map / Plan Target A enter 802 to use IMac for class or assignment Target A sit in front of IMac scenario1 : black screen -> break screen & ghost scenario2 : ghost coming out-> emoticon scenario3 : skeleton(scary sound) -> giggling
Contents Map / Plan
scenario4 : ghost movie clip
- 438 -
- 439 -
Wireframe Target A enter 802 to use IMac for class or assignment Target A sit in front of IMac scenario1 : black screen -> break screen & ghost scenario2 : ghost coming out-> emoticon scenario3 : skeleton(scary sound) -> giggling
Wire frame
scenario4 : ghost movie clip
- 440 -
- 441 -
Prototyping 1. black screen 2. face tracking 3. video playing (random playing
Prototyping
scenario 1, 2, 3, 4)
- 442 -
- 443 -
Visual Design 1. break screen & ghost 2. ghost coming out-> emoticon 3. skeleton(scary sound) -> giggling
Visual Design
4. ghost movie clip
- 444 -
- 445 -
Installarion Plan
Target A enter 802 to use IMac for class or assignment Target A sit in front of IMac. Camera sensor
Installation Plan
350px * 350px
- 446 -
- 447 -
Technical Structure Diagram Processing - Face tracing, camera sensor IMac sensor recognition practicing
Technical Structure - Diagram
images ( random )
- 448 -
- 449 -
Tired students in the elevator -> enter 802 -> black screen -> sit in front of IMac -> camera sensor -> video clip -> students are surprised
Storyboard
-> title / name
- 450 -
- 451 -
4.3
App 1. Revenge Mouth 2. Sound Drawing 3. Cat In A Box 4. The Visible Blind 5. .Horror & Fun
- 452 -
- 453 -
- 454 - 455 -
Seo Jaeeun
Kim Bohyun
Lee Boram
Kim Jihyun
Overview
Kim Bohyun
Our Members.
Title
MINI BOOT CAMP
Categories
APP
Concept & Goal
Concept
Kim Jihyun Seo Jaeeun Lee Boram
Our concept is 'bully', as in our app will bully the users to acheiveving their goals. We will not hesitate to use hurtful words and mean name calling. Goal To make an application that will motivate users to achieve their goals by provoking the users.
Expected User
People who wish to achieve their goal but lacks will.
Form Factor
Our original goal was to help people be motivated- however after several surveys we decided
Overview
that we will be the necessary evil and 'annoy' the people to achieving their goals
- 456 -
- 457 -
1. See Instruction video. 2. Runs the Mini Boot Camp. 3. Assignment or diet mode is executed.
User Scenario & Flow
4. Enjoy the game.
- 458 -
- 459 -
Success
Choose Level
Game Start
Playing
Fail
How-to
Choose Level
Game Start
Playing
Success
Choose Mode/ Facebook option
Contents Map / Plan
Intro
How-to
Fail
- 460 -
- 461 -
Wire frame
- 462 -
- 463 -
Prototyping
- 464 -
- 465 -
Visual design concept uses cute shapes and many vivid colors. our purpose is to get the attention of user by mak
Visual Design
-ing them interested.
- 466 -
- 467 -
Visual Design
characters
Character
Branding - 468 -
- 469 -
1. Hang the poster on the wall. 2. One of the computers are
Installation Plan
running our project. 3. The other one of the compu -ter shows the image for expla ining how to play the game. 4. Above the desk puts up the small size of the branded products such as posters and business cards .
- 470 -
- 471 -
Face tracking / Processing android mode
We used face tracking to achieve our goal to motivate people and help them exercise. If you choose 'work mode', our application will detect your face and scold you if you leave your designated area and wander off.
If you choose 'diet mode', our application will detect your face and force you to move by screaming loudly until you place
Technical Structure - Diagram
your face at the instructed area.
This was made possible by 'for()' , 'if()' and arryas[]. Array is especially important in 'diet mode' for it is the main code that gives our users the next destination for their head and forcing them to move.
- 472 -
- 473 -
Mini Boot Camp
Mini Boot Camp
Do you feel that you don’t want to do your assignment? Do you feel that you don’t want to do diet? ㅋㅋㅋㅋㅋㅋㅋㅋ
Mini Boot Camp
comic book
Diet
Mini Boot Camp!
Work mode will help your assignment!
1.Do you feel that you don’t want to do your assignment? Do the ‘Mini Boot Camp!’
♬
Assignment
2.Choose the mode and level of diifficulty.
3.Mini boot camp recongnize your face moving.
4.And character yell to you.
5.Then, you can finish your assignment!
그래도 집중이 힘드시다구요?
그런분들을 위해 준비했습니다!
zzz
8.Two player mode!
Diet mode is for lazy people!
9.Facebook option!
Mini Boot Camp
10.Mini Boot Camp!
Don’t forget! When you don’t want do your assignment! When you don’t want do diet!
Storyboard
How-to Mini Boot Camp
Mini Boot Camp!
Teaser - 474 -
- 475 -
- 476 -
- 477 -
- 478 -
- 479 -
- 480 -
- 481 -
- 482 -
- 483 -
- 484 -
- 485 -
- 486 -
- 487 -
- 488 -
- 489 -
- 490 -
- 491 -
Yoo Ga
Lee Yunsun
Seong Eonhyeong
Yoon Sungwoo
- 492 - 493 -
Overview
Yoon Sungwoo
Our Members.
Title
My memory map
Categories
Mobile app
Concept & Goal
Concept & Goal
Yoo Ga Seong Eonhyeong Lee Yunsun
Visualization of my travel data
Expected User
A person who can not often
Overview
exposed to art/ design
- 494 -
- 495 -
- 496 - 497 -
User Scenario & Flow
AT&T LTE
AT&T LTE
11:30 PM
Me map
AT&T LTE
11:30 PM
AT&T LTE
Memap
11:30 PM
AT&T LTE
Memap
11:30 PM
Memap
Location Finder
Memap
AT&T LTE
Camera
11:30 PM
Memap
Photo album
Visualization Album
11:30 PM
CAMERA
AT&T LTE
11:30 PM
CAMERA
AT&T LTE
11:30 PM
AT&T LTE
Memap
11:30 PM
Mypage 업로드 6장
포토맵 3장
꾸꾹이 대한민국만세!
Contents Map / Wire frame
My Page
my memory map
- 498 -
visual map Download
Setting
my memory map
- 499 -
불러오기 3장
Prototyping
- 500 -
- 501 -
My Memory Map, MEMAP Special Visual map, only for you - 2014년 11월 17일 여행/취미
Memap
Visual Design
Memap
my memory map
- 502 -
- 503 -
Visual Design
- 504 -
- 505 -
- 506 - 507 -
Installation Plan
if(d>30){
if (status == 0) {
vline += 1; if (vline>4) {
if (x > y) {
vline = 0;
if (mouseX>20 &&mouseX<70 &&
if (mouseX>230 &&mouseX<400 &&
mouseY>50 &&mouseY<100){
mouseY>55 &&mouseY<90){
statusMenu += 1;
card = 0;
}
if (statusMenu>2){
}
status = 1;
statusMenu = 0;
card += 1;
}
}
if (card>4) {
}else if(mouseY>pmouseY){
}
if (mouseX-pmouseX<0) { if (d>30) {
}
}
card=1; }
if(d>30){
else if(statusMenu == 1){
status = 1;
vline -= 1;
if (mouseX>20 &&mouseX<220 &&
if (vline<0) {
}
vline = 4;
} else if (mouseX-pmouseX>0) {
void vertical() {
mouseY>250 &&mouseY<400){
if ( vline == 1) {
statusMenu += 1;
}
if (statusMenu>2){
card -= 1;
status = 1;
statusMenu = 0;
if (card<1) {
}
}
if (d>30) {
image(vpage[0], 0, 0); } else if ( vline == 2) { image(vpage[1], 0, 0); } else if ( vline == 3) {
}
card=4;
Technical Structure - Diagram
if(statusMenu == 0){
}
}
image(vpage[2], 0, 0);
}
} else if ( vline == 4) {
else if(statusMenu == 2){
status = 1;
image(vpage[3], 0, 0);
if (mouseX>145 &&mouseX<240 &&
} }
} }
}
- 508 -
statusMenu += 1; if (statusMenu>2){
void mouseReleased() {
statusMenu = 0;
status = 0;
if(mouseY<pmouseY){
mouseY>160 &&mouseY<260){
}
if (y > x) {
}
}
}
}
}
void mousePressed(){
} - 509 -
- 510 -
- 511 -
- 512 -
- 513 -
- 514 -
- 515 -
- 516 -
- 517 -
- 518 -
- 519 -
- 520 -
- 521 -
- 522 -
- 523 -
- 524 -
- 525 -
konkuk univ. 2014 2nd semester MIXED MEDIA DESIGN WORK BOOK
with Prof. Jihyun Kim Editorial - Nayoung Kim, Kwangho Lee