This document summarizes Wenzhuo Duan's master's thesis project on designing an online interactive system using metaphors and photography. The project involved a literature review on imaging technologies, metaphor, and interaction design. An empirical study was conducted involving graduate students classifying and evaluating photographs based on a metaphor definition. Results showed metaphorical stimuli affected perceptions of usefulness and engagement. The design phase incorporated tagging, sharing, guessing and collecting based on research results. Future work could involve more participant testing and feedback to iterate the design.

1. AN ONLINE INTERACTIVE SYSTEM DESIGN
METAPHOR
& PHOTOGRAPHY
WENZHUO DUAN
DIGITAL WORLDS INSTITUTE
UNIVERSITY OF FLORIDA
MASTER OF ARTS
Personal Procedure
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
Literature Review
My Question
Imaging is a human behavior that emphasizes on
capturing, storing, and retrieving information from the
images.
!
Imaging technologies amplify (also filter) our imagining
powers, we must surely note another kind of power: the
power to incite others to imagine.
!
Some people have such powers while others lack them.
Since the mere imaging of situations can strongly affect
human conception, desire, and behavior, those powers
lead to wider ones, now much amplified by technologies
(Maynard, 2000).
Photography
Imaging Technology-Photography

2. Imaging Technology-Photographer
Highly control the arrangement of information
Japanese Photographer, Tanaka Tatsuya
Imaging Technology-Photographer
Metaphors are the fundamental
concepts, terms, and images by
which information is easily
recognized, understood, and
remembered.
Metaphors are commonly used
to explain something unfamiliar
or hard to grasp by way of
comparison with something that
is familiar and easy to grasp.
(Wiley, 2004)
!
Metaphors
Source
Target
My Question - Answer
Reference
http://myteachingspirit.blogspot.com/
The Role of Metaphor in Interaction Design, Dan Saffer
“She is on the top of
the situation”
“There is nothing in sight”
Orientate conceptual
information
Create artificial
Boundaries
Personify in terms of human
emotion,motivation
Metaphor-Language
Text

3. Reference
http://myteachingspirit.blogspot.com/
The Role of Metaphor in Interaction Design, Dan Saffer
Orientate conceptual
information
Create artificial
Boundaries
Personify in terms of human
emotion,motivation
Metaphor-Designer
Design process is a metaphor itself
Brainstorming technique
Deliberate tool
www.flyingmouse365.com
Imaging Technology-Designer
Imaging is a human behavior that emphasizes on
capturing, storing, and retrieving information from the
images.
!
Imaging technologies amplify (also filter) our imagining
powers, we must surely note another kind of power: the
power to incite others to imagine.
!
Some people have such powers while others lack them.
Since the mere imaging of situations can strongly affect
human conception, desire, and behavior, those powers
lead to wider ones, now much amplified by technologies
(Maynard, 2000).
Metaphor
Imaging Technology-Metaphor Imaging Technologies
Photography
Metaphor
Metaphor involves imaging since it can make connection of
invisible
and analogies as a source of
explain to others what they are doing or trying to do, in terms
that are familiar to them.(Lakoff & Johnson, 2003).
Photography as picture making and photographs as marked
surfaces, whether permanent or transient (on screens), as
depictions, prescribers and enticers of our imaginations, they
are functional objects. (Maynard,2000)
!
Photography highly defined compositional form falsifies the
medium, which is the joint product of the organizing mind and
physical reality. (Kracauer,1960)
Existing Studies

4. “A website never sleeps”
Imaging Technologies
This project is attempting to
combine metaphor and photography
with human to establish a website
and to inspire more possibilities in
interaction design.
metaphorical visual
components
“hidden letter”
photographs
Online interactive system
Online interactive system
Imaging Technologies
1.Background
Metaphor Photography
Metaphorical visual components
“hidden letter” photographs
4 Future Research
3 Design
Human/Emotion
2 Research Design
1 Background - Literature Review
Online interactive system
(Stimulus )
Human
Inspiration
. . . . . .
More Possibilities
• Metaphor • Photography
Imaging Amplification System
1.2 Emotion in Interaction Design1.2 Emotion in Interaction Design
• Stimulus==>Human (Cognitive activity executed) =New Emotion
• Interaction design for human: Tools==>Medium for emotions, sociability, pleasure)
1.3 Imaging Technologies as Stimulus for human to establish an interaction design
• Metaphor in interaction design
• Photography in interaction design
Reference
https://en.wikipedia.org/wiki/Interaction_design
The Theory of User Judgment of Aesthetics and User Interface Quality, Angeli, et al., 2006
1.1 Interaction Design:

5. 1 Background - Literature Review
In interaction design, calling attention is the process of selecting things to
concentrate on, at a point in time, from the range of possibilities available.
Interaction Design
• Metaphor• Photography
Deliberate Tool
Concept & Icons
!
UI(User Interface)
design requires
Metaphors
!
Turn Attention
PhotoVoice
Photographic Data
!
Extracted and
Interpreted (multiple
ways)
!
Call Attention
Reference
Visual Anthropology: Photography as a Research Method, Collier
Interaction Design: Beyond human-computer interaction, John Wiley
The definition of “hidden letter” photographs, are photographs that contain an
abstract symbolic shape that can be more or less interpreted as a “hidden letter” in it.
“Hidden Letter” Photographs=Metaphor+Photography
2.1 First-person perspective
!
2.2 Multiple person perspectives
!
2.3 Inspiration
!
2 Research Design
same
samers
Reference
www.mindmapinspiration.co.uk
Expectation
A reasonable web design
2.1 First-Person Perspective
Obvious or Unobvious? Amplified alphabetical shapes? Amplified Imagination? New emotion?
Reason1: Metaphor & Words (philosophy of language/human cognition)
Reason2: Non-textual & Textual information (photo/alphabet)
Reason3: Human & Nature (limited/strengthen)
2.2 Multiple-Person Perspectives
2.2.1 Photo Classification
Platform: Facebook, Wechat
Human: Graduate students
from Digital Worlds Institute
!
!
Conduction:
1, Gave them the definition of
“hidden letter” photographs
2,Asked for picking 12
obvious and 5 unobvious
according to the definition
Question: obvious or unobvious?

6. 2.2 Multiple-Person Perspectives
Conclusion1
Photos (metaphorical definition) = Differences + Similarities
2.2.1 Photo Classification
Sum of the votes
Obvious +1;
Unobvious -1
Question: obvious or unobvious?
Narrow down
the FOCUS
What is human’s preference when they’re asked
to evaluated a photo?
Aesthetic Value
Usefulness
Information Quality
Emotional Engagement
Memory
Overall Preference
whether appealing
whether useful
whether positive
whether positive
whether memorable
whether positive
Importancemeasured byexplained by
Reference
Interaction, Usability and Aesthetics” What Influences Users’ Preferences? Angeli, et. al
Interaction Design: beyond human-computer interaction, John Wiley
2.2.2 Metaphorical Stimulus Comparison
2.2 Multiple-Person Perspectives
8
4
2.2.2 Metaphorical Stimulus Comparison
2.2 Multiple-Person Perspectives
Specific
Importance
Group A
Group B
Importance
General
Importance
Importance
General
Pre-Test GroupA
https://duanwenzhuo.typeform.com/to/AlSDtd !
Post-Test GroupA
https://duanwenzhuo.typeform.com/to/JJLJN7
Pre-Test GroupB
https://duanwenzhuo.typeform.com/to/ZLLfJ0!
Post-Test GroupB
https://duanwenzhuo.typeform.com/to/y7LuGZ
2.2.2 Metaphorical Stimulus Comparison 5 point likert scale
1:1 Gender distribution
2.2 Multiple-Person Perspectives

7. Difference
General Questions - Difference of the importance ranking
2.2.2 Metaphorical Stimulus Comparison
Pre Importance
Post Importance
2.2 Multiple-Person Perspectives
Result: the least important “usefulness” showed
the most positive increase after metaphorical
stimulus(Group A).
Specific Questions - Difference of Average Scores
2.2.2 Metaphorical Stimulus Comparison
2.2 Multiple-Person Perspectives
Result: the lowest score is “usefulness” on average.
Specific Questions - Fluctuation of each indexes
8 Obvious
4 Unobvious
2.2.2 Metaphorical Stimulus Comparison
2.2 Multiple-Person Perspectives
Sum (obvious_Talk&Share) + Sum (unobvious_Talk&Share) = 3.1 + 1.6 = 4.7;
Sum (obvious_Usefulness) + Sum (unobvious_Usefulness) = 2.5 + 2 = 4.5.
!
Result: the biggest differences between A and B are “usefulness”
and “talk & share” .
Aesthetic Value
Usefulness
Information Quality
Engagement
Talk & Share
Overall Preference
Aesthetic Value
Usefulness
Information Quality
Engagement
Talk & Share
Overall Preference
General After Stimulus
2.2.2 Metaphorical Stimulus Ranking
!
!
Usefulness: 6th->2rd
Talk&Share: 4th->1st
2.2 Multiple-Person Perspectives
Conclusion2
Metaphorical stimulus easily affect: Usefulness + Talk&Share
the least importance unrealized

8. “If you are
asked to
use three
words to
describe
this photo.”
2.2.3 Open-ended Feedback
2.2 Multiple-Person Perspectives
2.2.3 Open-ended Feedback
Group A
8 Obvious
4 Unobvious
2.2 Multiple-Person Perspectives
2.2.3 Open-ended Feedback
Group B
2.2 Multiple-Person Perspectives
“Even though some of them are not
appealing enough, information still can be
enlarged by these photographs, to make
memorable”
“I can feel what you are trying to do, I
cannot explain but it makes feel that all
the pictures have increased a level”
“I like pictures that are interesting”
“It’s boring”
“There are too many questions”
2.2.3 Open-ended Feedback
Group A
Group B
2.2 Multiple-Person Perspectives

9. art and non-art major students
Different visual perception
2.2.3 Open-ended Feedback
2.2 Multiple-Person Perspectives
Conclusion3
Metaphorical direction = Thought-provoking
2 Research Design
2.1 First-person perspective
!
2.2 Multiple person perspectives
!
2.3 Inspiration
Online interactive system
Usefulness
Talk&Share
Thought-
provoking
Differences
Similarities
3 Design
Concept
Design
Content
Design
Creative
Design Online interactive system
Thought-
provoking
Differences
Similarities
Usefulness
Talk&Share
3 Design
Concept
Design
Differences
Similarities
Content
Design
Creative
Design
Thought-
provoking
Tagging+Sharing+Guessing+Collecting
Research results & feedback
From Sight to Insight
Online interactive system
Usefulness
Talk&Share

10. Seeing=>Grasp Essentials
Animal
Appearance
Habit
Behavior
CharacteristicHuman
Grasp Essentials==>Seeing
when we see?
What do we see?
Invisible vs Visible Hide vs Seek
Seeing=>Grasp Essentials
Grasp Essentials==>Seeing
Photography Metaphor
+
EASY
MODE
Imaging Technologies
Online interactive system
Imaging Technologies
4 Future Research
Metaphor Photography
Metaphorical visual components
“hidden letter” photographs

11. • Photographer-photographee interactive experiment - multiple person/multiple photo data
• Design - more functional/more content
• Metaphor in interaction design - double edges/go in more depth
Literature ReviewIRB Protocol Design Draft
4.1 First Person Perspective
Preference Questionnaire Design is a process
of iteration
4.2 Multiple Person Perspectives
Feedback for design
• Questionnaire - explanation/imagination by other visual components
• Feedback - more organized/more critical
• Design is a process of iteration - more tests/more feedback (in a long run)
4.3 More
Researchers
• Differences: Non-art & art students
• The camera as a research tool
• Photography Therapy
!
Designers
• Enthusiasm for science
• Interesting and informative experience
• The role of human
NASA Satellite Images The Big Hunt reCAPTCHA

12. What are those floaty things in your eye? - Michael Mauser
https://www.youtube.com/watch?v=Y6e_m9iq-4Q
Other Related Recommendation
Metaphorically speaking - James Geary
https://www.ted.com/talks/james_geary_metaphorically_speaking?language=en#t-461474
5 Acknowledgment
I thank Angelos Barmpoutis, for offering me lots of
information and inspiration patiently and helping me
organize the structure of my study.
!
I thank Lisa Anthony, for giving me practical and
powerful instructions for conduction of questionnaires.
!
I thank Patrick Pagano, for exposing me all sorts of
interesting knowledge to widen my horizon.
!
!
!
I thank my father and mother, Sanji Duan and Meiwen
Zhang, for supporting and trusting me all the time.
!
I thank all of people who have ever helped me. I thank
all of you sincerely.
More possibilities
Thank you
WENZHUO DUAN
DIGITAL WORLDS INSTITUTE
UNIVERSITY OF FLORIDA
MASTER OF ARTS