-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathchapters.html
181 lines (148 loc) · 8.53 KB
/
chapters.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!-- website: Artful Design (http://artful.design/)
author: Ge Wang (http://www.gewang.com/ | http://ccrma.stanford.edu/~ge/) -->
<html lang="en">
<!-- HTML head -->
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125238768-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-125238768-1');
</script>
<!-- character set -->
<meta charset="utf-8">
<!-- responsive viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<meta name="keywords" content="Artful Design, Technology in Search of the Sublime,
A MusiComic Manifesto, Ge Wang, Stanford University Press, CCRMA, ChucK, Ocarina, Smule,
Stanford Laptop Orchestra, design, art, computer, music, technology, aeshetics, philosophy,
engineering, ethics, comic book, textbook, education">
<meta property="og:url" content="https://artful.design/chapters.html" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Artful Design | Chapters" />
<meta property="og:description" content="A book about how we shape technology, and how technology shapes us.
It was created in the medium of a full-color, 488-page comic book." />
<meta property="og:image" content="https://ccrma.stanford.edu/~ge/artfuldesign/images/book/artful-design-book-8.jpg" />
<meta property="fb:app_id" content="966242223397117" /> <!--default app id-->
<!-- file-specific style and overrides -->
<style>
.bgimg-1 {
position: relative;
opacity: .95;
background-position: center;
background-size: cover;
}
.bgimg-1 {
background-image: url("images/book/artful-design-book-8.jpg");
min-height: 25%;
}
</style>
<!-- include bootstrap CSS file -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<!-- include artful.design CSS file -->
<link rel="stylesheet" type="text/css" href="css/artful-design.css">
<!-- page icons-->
<link rel="apple-touch-icon" sizes="180x180" href="images/icon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="images/icon/favicon-16x16.png">
<link rel="manifest" href="images/icon/site.webmanifest">
<link rel="mask-icon" href="images/icon/safari-pinned-tab.svg" color="#5bbad5">
<link rel="canonical" href="https://artful.design/chapters.html" />
<!-- page title -->
<title>Artful Design | Chapters</title>
<!-- header end -->
</head>
<!-- content body -->
<body>
<!-- main navbar -->
<nav class="navbar navbar-light navbar-expand-custom fixed-top d-print justify-content-end">
<!-- BRAND -->
<a class="navbar-brand mr-2" href="./">
<img src="images/title/artful-design-title-logo-b-sm.png" alt="Artful Design logo" style="width:200px;">
</a>
<!-- BUY button -->
<a class="btn btn-primary btn-lg" href="buy.html">BOOK</a>
<!-- toggler/collapsibe Button -->
<button class="navbar-toggler ml-auto artful-hamburger" type="button" data-toggle="collapse" id="artful-hamburger" data-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"></span>
</button>
<!-- navbar links -->
<div class="collapse navbar-collapse flex-grow-1 text-right topnav" id="collapsibleNavbar">
<ul class="navbar-nav ml-auto flex-nowrap">
<li class="nav-item">
<a class="nav-link" href="./">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="chapters.html">CHAPTERS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="author.html">AUTHOR</a>
</li>
<li class="nav-item">
<a class="nav-link" href="teach/">TEACH</a>
</li>
<li class="nav-item">
<a class="nav-link" href="events.html">EVENTS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="tv/">AD:TV</a>
</li>
<li class="nav-item">
<a class="nav-link" href="more.html">MORE...</a>
</li>
</ul>
</div>
</nav>
<!-- end navbar -->
<br><br><br><br>
<!-- MAIN SPLASH IMAGE -->
<div class="bgimg-1">
<div class="caption-chapter">
<font color="white">
<h1><b>
CHAPTERS</b></h1>
</font>
</div>
</div>
<div class="artful-body-chapter">
<h3> WAYS TO READ THIS BOOK</h3>
<p><i>Artful Design</i> takes readers on a journey into the art and philsophy of design. There is a path from beginning to end, as chapters develop through computer music instruments, toys, visual, audio, toys, games, social tools, and a moral-ethical dimensions of artful design. But you’re also invited to find your own way. </p>
<p>
• <b>Read slowly.</b> Give yourself time and space to think. The visual context is as important as the text, so inhabit the world created on each page.<br>
• <b>Read Chapter 8</b> (p.398) — perhaps even first. Circle back and see how the rest of the book connects into it.
<!--The end is also the beginning.--><br>
• <b>Channel your inner-nerd</b> (and philosopher). It's a very nerdy book. Revel in it.<br>
• <b>Listen</b> to your favorite music when reading. It won't help you read the book, but music is awesome!<br>
</p>
<br><hr width="200">
<h3 class="mt-3 mb-3"> THE CHAPTERS</h3>
<center>
<a target="_blank" href="stuff/samples/selected/artful-design-toc.jpg"><img border="0" width="55%" class="image-fluid" src="material/images/artful-design-toc.jpg"></a>
<br><br>
</center>
<p><b>Prelude</b> | Welcome |
<a target="_blank" href="stuff/samples/selected/artful-design-toc.jpg">Table of Contents</a>
| <a href="stuff/samples/prelude.pdf">Start reading now (pdf)</a></p>
<p><b>CHAPTER 1: Design Is ________</b> | What is design? A working definition, and the abiding elements of design as a human institution; The difference between means vs. ends, pragmatics vs. aesthetics</p>
<p><b>CHAPTER 2: Designing Expressive Toys</b> | Connecting people to musical expression through technology; Mobile phones; The designs of music-making apps: <i>Ocarina</i> and <i>I Am T-Pain</i></p>
<p><b>CHAPTER 3: Visual Design</b> | Principles of designing interactive visuals; Forms, motion, personality and strange design loops; Cats and the design of the world's most depressing photo album software</p>
<p><b>CHAPTER 4: Programmability and Sound Design</b> | The art of programming and the design of musical sounds, from Ada Lovelace to computer music programming languages; Simulating the <i>THX Deep Note</i> to transforming reality with computers (and some audio digital signal processing)</p>
<p><b>CHAPTER 5: Designing Expressive Toys</b> | The membrane of interaction between humans and technology; Interaction loops, musical instruments, embodiment in design; The birth of the Laptop Orchestra</p>
<p><b>Interlude: Dialogue with a Zen Master</b> | A visit to a teacher and zen master of computer music instrument design, high up in the mountains; The philosophy of music-making coffee mugs, squeezevoxes, rubber chickens; Pondering life, engineering education, and Everything</p>
<p><b>CHAPTER 6: Game Design</b> | Designing for play and gamification; Three case studies of games: <i>Starcraft 2</i>, <i>Save the Date</i>, and <i>That Dragon, Cancer</i>; The design of musical games like <i>Magic Piano</i> and <i>Magic Fiddle</i></p>
<p><b>CHAPTER 7: Social Design</b> | Shaping technology to connect humans; Thinking about values of social tools; Expressiveness and transparency; The (largely under-tapped) power of designing for strangers; Mechanical Turks, clouds, crowds, and social karaoke</p>
<p><b>CHAPTER 8: Manifesto</b> | It all comes together in this final chapter; The conscience of this book, and the search for design's nature, purpose, and meaning in the crucible of our ever more technological world; Are we happy? Designing from both needs and values; The "humanist engineer" and the "pi-shaped individual" (and why humanities, art, and social sciences intrinsically matter to engineers); Aesthetic self-fashioning and pursuing human flourishing; The Everyday Sublime</p>
<p><b>Coda: In Search of the Sublime</b> | (The end is the beginning.)</p>
</div>
<!--<img class="img-fluid" width="500" style="max-width: 90%" src="images/gesticulate/gesticulate-c-70c.jpg">-->
<!-- scripts -->
<script src="js/jquery-3.3.1.slim.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- content end -->
</body>
</html>