Author Archives: Xiaoman Chen

Meitu app re-examined, from a design perspective

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Xiaoman Chen


Meitu has been the leading photo-editing app in China for ten years and now begins to expand its presence worldwide. Popular functions mainly include photo editing, one-touch beautification, AI art painter, etc. The biggest reason for its rise lies in its organic mechanism of cutting-edge technologies such as image enhancement programs, facial recognition, image generation and so forth. Meitu itself did not have any novel technological breakthroughs, but by optimizing the usage of existing technologies, it displays the power of combinatorial design. Another reason is wide applicability that makes it available both for PC and mobile devices within various systems. Besides, in terms of user interface, Meitu sets multiple forms of constraints to ensure the usability of the application. As a phenomenal image-editing app that interacts with individuals and the society as a whole, Meitu is gradually reshaping the face of daily life and culture. This research paper will further scrutinize design aspects behind its popularity: technical dependence, user interface, and social role of Meitu.


In China, it is a typical scenario that people stretch out arms taking selfies within less than three seconds and then retouching blemishes or adding filters for a half-hour before posting them on social media. Image editor apps are widely used in China, whose selfie consumers might be the most advanced in the world. According to the statistics, each user has more than 2 photo editing apps downloaded on their phone. Among them all, Meitu is undoubtedly the superstar in this realm.


Figure 1. Statistics: each user installed an average of 2.4 apps. (Image source:

Figure 2. Meitu logo. (Image source:

Meitu starts off as a PC version of photo editor in 2008 and later launched at mobile devices in 2011. As a powerful photo editor to go viral, Meitu app has created a rich portfolio of offerings by integrating advanced photo imaging technologies into one platform and introduced them to everyday life through an intuitive interface. With a mission of making the world a more beautiful place, it has led the mainstream aesthetics trend and helped improve users’ social lives. That’s why after 10 years of growth, facing with newborn competitors, it is still the dominating image processing apps in China and worldwide. So far, Meitu has ranked No.1 by daily new user and No.2 by weekly active penetration rate. From a global scope, it’s available in more than 26 countries and been downloaded more than 1 billion times. Meitu is a phenomenon.

Figure 3. Photo editing app–daily new user average. (Image source:

Figure 4. Photo editing app–weekly active penetration rate. (Image source:

In order to get a general understanding of how it works, first we can take a quick tour on its interface and main features.

Click on the pink icon with characters “Meitu”, which stand for “beautiful picture”, and then we are on the main page that includes multiple options for photo editing. All of those modules are presented with understandable icons to imply their functions: a camera icon for taking photos, magic wand for basic editing, woman figure for reshaping portrait, grids for collage, a notebook for tips, etc.

Figure 5. Meitu chart-flow

Among all those modules on the main page, “Edit” and “Beautify” are two essential parts that aggregate core functions. “Edit” gathers a number of basic photo editing options that are relatively standards, such as “auto-enhance, crop”, “brightness”, “text”, “eraser”, etc. Whereas “Beautify” is to retouch on human face or body shape: enhancing skin, erasing acne and wrinkles, slimming down one’s face, making one look taller, etc. To operate those functions, all we need to do are dragging the bar down on the page or simply touching up on screen. Those core functions are basically the Photoshop sections but in a “one-touch” way. Another star feature in Meitu is ArtBot Andy, an AI robot that repaints selfies with a choice of styles and visual effects. At the time of writing a total of 712,042,886 users had witnessed the ArtBot’s “tech magic”.

Overall, the interface of Meitu is straightforward. Details about those functions mentioned above will be further discussed in the following part. Actually, Meitu did not invent any novel technologies throughout its development, but it is still one of the users’ favorites. What makes it possible? What makes it user-friendly? This article will answer those questions by re-examining Meitu app from a design perspective: combination, constraints, and sociotechnical system.

What makes Meitu possible?

  1. Technology combination

In the book “The Nature of Technology”, one core principle illustrating the essence of technology is combining existing elements, which are technologies themselves. Every novel technology, according to Arthur, was born as a hybrid of mechanical and organic. So was Meitu app.

When people say Meitu app is an innovator, they are talking about its innovation of presenting multifunction. As a commercial success in photo editing mobile application market, Meitu clearly knows the power of combining existing technologies. Throughout its development, Meitu itself comes with no new technological breakthroughs but adopts existing technologies to one platform where all of them come into play collaboratively.

Figure 6. Meitu neutral network inference framework. (Image source:

  • Image processing programs

“P图”, a phrase that means editing photos, were not that popular in China until the rise of Meitu. In this phrase, “P” originates from the name of a professional graphics editor, Photoshop, which was developed by Adobe systems. The first version of Adobe Photoshop was released in the 1980s when photo editing computer programs emerged. It does have magical features, with a variety of color adjustments, filter toning, highlight coverage, local processing, free transformation, etc., precisely modifying the picture. However, such a complex system requires a large amount of manual adjustments and is not something that every user can tackle.

As mobile devices become ubiquitous, various photo editing apps are emerging one after another. They can access the camera anytime by implementing the system API–application programming interface–and collect images from it for processing. Those magical features of photo apps are actually realized by integrated, stylized, template-based series of image processing programs.

Figure 7. MTenhance: Image Enhancement. (Image source:

For removing the defects of an image such as spots and acne on the face, it is usually a matter of changing the color and greyscale of the skin around the face. If a part of the photo has a relatively large gray level, it will be detected as a “noise”. Therefore, the secret to clearing acne is actually the “noise reduction” in image processing. This is the most common way to handle images and includes various algorithms, such as the filtering algorithm, which aims to replace the original value with the average of surrounding gray levels for the purpose of lowering the gray level difference to make the noise not so obvious. Through the user interface, users were just removing the spots with a simple drag on the adjustment bar under this function where they are actually setting a threshold for the noise reduction.

Similarly, most popular filters are characterized by overexposure, low contrast, and offsets of shadow and highlight hue. In 2011, Instagram pioneered in the field of “automatic filter” through the combination of brightness, contrast, and saturation in one process.

Simply put, in terms of basic photo editing, Meitu is more like a light-weight version of Photoshop, with lower technical requirements. Although image editing software like Meitu seems to be more updated and more powerful, the basic image editing programs are already mature and are similar to those of the past.

  • Face recognition

Another important feature in Meitu is reshaping one’s face and eyes and adding make-up or accessories automatically. This function is actually realized by the facial recognition system, which is capable of identifying or verifying a person from a digital image or video source. Facial recognition could be traced back to 60 years ago and has been used in various areas: security system, financial authentication, brand and PR agencies, etc. In the past decade being utilized in entertainment apps more frequently.

Figure 8. MT Face: Face-related technology. (Image source:

The realization of face adjustment is clearly structured: face detection–key point positioning–region harmonizing–color blending–edge blending. Face detection is the capture of how many faces on a photo. Now it has overcome the problems caused by face angles, expression changes, light intensity and so forth. The basis of face detection is the key point positioning, that is, to find where the nose is, where the eyes are, and this process is often achieved by neural network technology for machine learning. After the key point positioning, the operation of “reshaping face” has a foundation. After finding the outline of the face, the shape can be changed through certain calculations and graphics transformations. The same is true for the eyes, eyebrows, and mouth. Then, in order to make sure that it can be coordinated with the picture to be implanted, it is necessary to color-harmonize the face to ensure its color consistency and image fusion. The last thing to do is to implant the face features into the prepared template.

Figure 9. Deep Neural Network. (Image source:

Nowadays, Meitu makes the adjustment process can be realized in a real-time manner–with the help of deep neural network technology. Turn on the front camera, and we can see a beautified self.

  • Image segmentation and generation

Andy the ArtBot, labeled as the world’s first A.I. painting robot, is now a superstar in Meitu app. Meitu Inc has been researching and developing artificial intelligence for years. In 2010, Meitu Inc established the Meitu Imaging Laboratory (MTlab). In 2012, MTLab began to pay attention to artificial intelligence and deep learning. Andy is the latest outcome of MTlab—more specifically–its latest successful case of combining image segmentation and generation technology.

Figure 10. MTgenerate: Image generation. (Image source:

Actually, those have previously been applied in the field of painting. For example, Google’s AutoDraw can match a user’s sketch with an existing image in the database to complete this picture. At the Davos Forum, Kai-Fu Lee also tried to use a robotic arm to do a painting. Comparing to image matching and robotic arm painting, completely repainting a portrait—as Andy does—is not something brand new but a bit more complicated.

By dismantling technologies used in Andy, we will find the following steps:

First, Andy learned a lot of illustrations, based on which he created a generic painting model. That is a long-term process of image generation. The core of image generation technology is based on the production network “Draw Net” that developed by MTlab. Draw Net is responsible for constructing painting models through big data analysis and deep learning. The artistic styles of those models all generate from a database that includes various compositions and strokes.

Second, after seeing the user’s selfie, with the help of facial recognition technology (which we have mentioned above), Andy grasps the contours and facial features of the user.

Then it locates the hair, clothes and background areas by using image segmentation technology.

Finally, by using the painting model to present the main features, Andy finishes his job.

It is not the first time that Meitu applies image generation and segmentation technology. At the beginning of 2017, Meitu app launched a “hand-drawn” feature, which is their initial try of combining facial and segmentation technologies. Also, prior to Andy’s birth, generation technology was being used in a fun feature in Meitu, from which users can see what they will look like if they were Europeans. Through big data and deep learning, the “machine” mastered the facial features of people from different countries and then uses Draw Net to generate a network, for the purpose of converting the user’s Asian features into European features. Andy, in this sense, is a mature form in this combinatorial revolution.

2. Software & hardware dependence

By borrowing existing technologies, the software is well prepared to be implemented. The next step is to find a “medium” to place it. Here, the medium mainly refers to two aspects: software and hardware.

As for software, it means the operating system (OS). Specifically, it is a collection of software that manages hardware and provides services for programs like Meitu. It is able to hide hardware complexity, manages computational resources, and provides isolation and protection. Meitu is no different with any other programs. To use Meitu on laptops or smartphones, people don’t have to literally speak binary, comprehend machine code of this program but understand it in a streamlined graphical user interface (GUI). Through this interface we can work on the image with a mouse or a finger, clicking and seeing them happening right in front of you. All this translation work is done by the translator in your device—the operating system. Most of us are using them every day: Windows, Mac, Linux, Android, iOS, etc. There are universal key elements of those operating systems. The first one is abstraction. They basically eliminate all the unnecessary, redundant “things”: process, thread, file, sockets, memory, etc. The second one is mechanism. Main actions it conducts include creating, scheduling, opening, writing and allocating.

Hardware, as its name implies, includes tangible components of a computer: motherboard, central processing unit, memory, storage, monitor, mouse, keyboard, etc. for the personal computer; display, camera, application processor, sensor, memory, etc. for mobile devices. Although they seem to have nothing to do with Meitu itself, still, software and hardware are two prerequisites for Meitu and other applications.

The secret behind the large user base of Meitu partly lies in its low requirements of hardware and software dependence. In 2008, Meitu was initially born as a computer photo editing software. Unlike Photoshop, which is relatively high demanding in hardware requirements especially processor, RAM, hard-disk space, etc., Meitu is much more light-weight. Plus, compared to its mobile application competitors, there are multiple choices of operating systems that are compatible with Meitu app. The applicable operating systems so far include Android, iOS, Windows, iPad, WindowsPhone.

“Meiyan camera”, all also called beauty camera, is a trendy function in Meitu app by which users will get auto-beautified selfies in real time. The operating process of “Meiyan” camera, could be a good case of wrapping up all the combinatorial components in Meitu app.

Figure 11. Flowchart: how beauty camera works

When users turn on Beauty camera and start taking photos, Meitu would get connected to their camera and the ambient light sensor embedded in the smartphone, detecting the surrounding environment. If the light is too dark and causes much noise, the application will automatically turn on the noise reduction/image denoising and exposure correction to make sure the result is noise-free and bright. Meanwhile, for the purpose of making further adjustment like enlarging eyes, smoothening skin, etc., and realizing beautification function, the app turns on its facial recognition to grasp main physical features in picture and then applying other image editing techniques in order to get a facial beautification effect (like smoothening skin, enlarging eyes, etc.). Thanks to the synergy and combinatorial property of Meitu, the whole process of taking photos and retouch runs smoothly within three seconds.

What makes Meitu usable?

As a platform gathering various powerful technologies, another important responsibility for Meitu app is to increase the usability of the application, which means to hide the complex behind technical part, reduce the possibilities of misleading or jeopardizing efficiency. To realize that, application designers need to make the interface clear and intuitive. Here, the concept of “constraints” has to be taken into consideration.

According to Donald Norman´s classic The Design of Everything Thing, constraints is to limit the actions of users on a system. By restricting users’ behavior, designers can help users understand the status of the system they are in and thus reduce the chance of errors. Through the interface of Meitu app, we could easily find how constraints are applied.

  • Paths

Paths are to help users control in a limited variable range. Usually, they are designed in forms of progress bar or channels, of which shape restrict users’ action to linear motion. Most of image editing functions in Meitu embed intensity bars for the user to make adjustment intuitively. The interface is neat and clean, with only a linear bar on it. As it shows, hardly could users misuse this mode.

Figure 12. Screenshot: brightness intensity bar

  • Barriers

Barriers are designed for redirecting users’ actions, which are heading to a relatively negative or unsuccessful result. If users press the backward button in the middle of the image editing process, the dialogue box will pop out asking the user if he/she decides to quit or not. In another case when image quality would potentially be harmed after editing, the system will inform users with an attention box. With barriers applied to the interface, users are given more transparency to what consequences they are going to face and more agency to make a choice.

Figure 13. Screenshot: barrier settings in Meitu

  • Symbols

In terms of design, symbols take the form of text, sound, visual images, etc., which are used for categorizing, clarifying, and cautioning users about certain actions. “Undo/Redo” options at the top of the screen would be a good example of symbols being used for constraint in Meitu. When the user cannot undo/redo previous effects any further, the “back” or “forward” symbol would be grayed out as a caution. Similarly, a direct text notification can be viewed as a constraint if the system is unable to complete a certain action.

Figure 14. Screenshot: symbol setting in Meitu

Conversational interfaces are of great necessity because through which users are given the opportunity to speak to their devices. Otherwise, the interface will function inefficiently considering the endless possibilities of how to use it will be frustrating to the users. From this perspective, Meitu is qualified for implementing multiple forms of constraints.

How Meitu exerts influence on society?

“If someone shoots another with a gun, who is doing the shooting—is the person or the gun?”, Latour asked. The seemingly absurd question highlights the necessity to think about the relationship between humans and non-human artefacts. From a sociological perspective, humans and technical objects cannot be separate but intermingle. Latour makes this intertwining clear on a conceptual level by introducing “technical mediation.” The gun is a mediator that actively contribute to the way in which the end is realized. The same is also true for Meitu app. Under a sociotechnical context, we could never ignore its interaction with other components and how they influence one another.

  • Beauty Obsession

There is a name for a new kind of face perfected by the Meitu app–with enlarged eyes, sharpened chins, pale skin–which now you see everywhere on the internet and even reality: “Wang hong lian” (internet celebrity face). This trend is fueled by the centuries-old tradition obsession with flawless skin and big eyes. On the one hand, Meitu leads this trend and continuously consolidates public views towards the concept of beauty with its technical tricks embedded. On the other, such an epidemic of stereotype counter-forces Meitu to constantly upgrade its popular functions related to face reshaping.

  • Culture penetration

During the 2018 spring festival, Meitu launched a new activity to celebrate, called “winning gift money with face score”. By using its AI ArtBot function, users send a selfie portrait to the system to calculate the user’s facial attractiveness and then they get gift money according to the rating. Debuted on 15 February, the activity attracted many users, and two million yuan for the Spring Festival was claimed very rapidly. Apparently, Meitu added more fun to a traditional custom with the help of technology.

  • Commercial pressure

Under the guidance of mass culture, Meitu is undoubtedly transforming from industrial products to consumer products. The emergence of social media enables it a higher degree of generality and greater penetration. By frequent sharing of selfies retouched by Meitu on social media, young people unintentionally help providers to promote their products and services. and therefore contribute to the commercial pressure.

In ten year, Meitu has been installed on more than one billion phones mostly in Asia areas. It has been estimated that more than half the selfies uploaded on Chinese social media have been retouched by Meitu. Apparently, its popularity is the result of synergies between different actors and organizations, meaning that we users and application itself are co-evolving constantly and mutually. From the very birth of any software application, it was being influenced by users’ needs, market conditions, technology development, etc. In the case of Meitu app, mobile devices development, software technology, target costumer’s behavior (mainly referring to female under 30), current social background directly decide how the app would be designed and updated. On the other hand, Meitu is also changing–or becoming–a part of Chinese culture.



As the pioneer photo editing app in China, Meitu app is innovative in combining and transforming multiple existing technologies on one platform, shortening the distance between users and emerging technologies within an intuitive interface. Before selfie apps were everywhere, Meitu set a basic model for its followers, explored various possibilities for the future trend of photo-editing: face-related technologies, image generation, motion capture…it is fair to say the biggest achievement of Meitu is introducing cutting-edge technologies to everyday life, with much fun.

 [Works cited]

Arthur, W. B. (2009). The nature of technology: What it is and how it evolves. Simon and Schuster.

Augusteijn, M. F., & Skufca, T. L. (1993). Identification of human faces through texture-based feature recognition and neural network technology. In Neural Networks, 1993., IEEE International Conference on (pp. 392-398). IEEE.

Berg, L. (2018). Young consumers in the digital era: The selfie effect. International Journal of Consumer Studies42(4), 379-388.

China’s Selfie Obsession | The New Yorker. (n.d.). Retrieved December 3, 2018, from

Fan, H., & Ling, H. (2017, October). Parallel tracking and verifying: A framework for real-time and high accuracy visual tracking. In Proc. IEEE Int. Conf. Computer Vision, Venice, Italy.

Jiguang (n.d.). Retrieved December 5, 2018, from

Latour, B. (1994). On technical mediation. Common knowledge3(2), 29-64.

Li, P., Ling, H., Li, X., & Liao, C. (2015). 3d hand pose estimation using randomized decision forest with segmentation index points. In Proceedings of the IEEE international conference on computer vision (pp. 819-827).

Liang, P., Blasch, E., & Ling, H. (2015). Encoding color information for visual tracking: Algorithms and benchmark. IEEE Transactions on Image Processing24(12), 5630-5644.

Manovich, L. (2013). Software takes command (Vol. 5). A&C Black.

Meitu – Beauty Themed Photo & Video Apps. (n.d.). Retrieved December 5, 2018, from

MTlab. (n.d.). Retrieved December 11, 2018, from

Norman, D. (2016). The design of everyday things. Verlag Franz Vahlen GmbH.

Norman, D. A. (1999). Affordance, conventions, and design. interactions6(3), 38-43.

Photoshop system requirements. (n.d.). Retrieved December 8, 2018, from

Rankings – Cheetah Data. (n.d.). Retrieved December 4, 2018, from

Schwebs, T. (2014). Affordances of an App: A reading of The Fantastic Flying Books of Mr. Morris Lessmore. Barnelitterært Forskningstidsskrift, 5(1), 24169.

Van den Muijsenberg, H. J. (2013). Identifying Affordances in Adobe Photoshop (Master’s thesis).

Varagur, K. (2016, May 2). “Auto-Beautification” Selfie Apps, Popular in Asia, Are Moving into the West. Retrieved December 3, 2018, from

You, H., & Chen, K. (2007). Applications of affordance and semantics in product design. Design Studies, 28(1), 23–38.

Zheng, A., Cheung, G., & Florencio, D. (2018). Joint Denoising/Compression of Image Contours via Shape Prior and Context Tree. IEEE Transactions on Image Processing27(7), 3332-3344.

Group Project – Week 13

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

For Xiaoman & Tianyi’s presentation, please check this out!

Reading Response – Week 12

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

When it comes to the web browser–the client browser. It could be a desktop browser or a mobile web browser like something we’d find on a smartphone, or other application with embedded browser, or even appliance (e.g. watch, fridge, car dashboard). Anything we can go get resources on the web and display them for you is a web client browser. Let’s say, if I want to get something out on the Google Chrome to display, I should tell the browser where to go by using a URL. As we already know before, the user interface is what’s presented to the user to interact with. The browser displays to you the address bar, back and forward buttons and other visual elements you can interact with. This is the URL where I need to go every week.

Screenshot. 1

The first thing you see in a URL is the protocol–things like HTTP or HTTPS or FTP or any number of other schemes. Then there is a colon and a double slash that separate the scheme from the rest of the URL and the following thing is a domain. The first part is the name of the server and it can be the name of particular machines plus the domain of all of the machines owned by a particular organization (e.g. org, edu, com). There are also optional port, the path to the resource itself, an optional query string and fragment ID. The current URL displays at the top of the browser where we can type it in. URL also appears in HTML tags for resources used in the page and hyperlinks. They can tell the browser go to this location, go get an image, for example, and display it.

Screenshot. 2

Go back to a client browser. It has a rendering engine that is responsible for displaying the visual representations of the web page. The rendering engine is like a painter working on a blank canvas. It has the responsibility to construct the page by applying the right structures and colors. The engine takes in HTML and CSS documents, then displays its interpretation of both. As we have learned from this week’s reading, HTML is to markup our content and CSS is used to style and animate our content. Plus, the browser engine acts like a chief commander who directs actions between the user interface and the rendering engine as well as external communication with servers. To receive content, the browser has to communicate over the network asking for all the necessary images and documents that make up the page. When an image is missing on the page, this usually means the network failed to fetch the image from the server. To apply interactive logic and functionality to our website, it needs to rely on a programming language called JavaScript. The browser has no idea how to deal with JavaScript directly. Here we need a way to translate the communication. It is done with an interpreter. Browsers have their own JavaScript interpreters. Such as SpiderMonkey is for Firefox, and V8 is for Google Chrome.


Credits to:

Martin Irvine, Intro to the Web: Extensible Design Principles and “Appification”

Ron White, “How the World Wide Web Works.” From: How Computers Work. 9th ed. Que Publishing, 2007.


Week 11- Reading Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Through all the previous discussions upon design principles, the most impressive one I’ve learned is “the invisible things are often the most powerful.” The design principles for “abstraction” and “black-boxing” in a complex system works on the internet as well. “The difficulty in learning the key design principles of the Internet is that the complexity of the system is hidden both by design and by platforms.” Indeed, most of us are passive internet users, merely knowing how to use it rather than actually understanding how it works. Understanding how it works is not that necessary though. After all, the internet is just another human artefact that serves all the uses of our symbolic media systems, not being designed to reveal its mechanisms. But learning itself does benefits to understanding the whole socio-technical system from a macro perspective and further equipping ourselves with a mind of designing thinking.

Instead of being a bubble cloud in my mind, through the reading I realize the Internet is just a wire buried in the ground. Two computers directly connected to this wire can communicate. Basically, a server is a special computer connected directly to the internet and the web pages are files on that page’s hard drive. Every server has a unique internet protocol address. Similar to the postal address, internet protocol address help computers find each other. What we are using as internet applications-e.g. Google, YouTube, Facebook-are the names of their protocol addresses. Our personal computers are not directly connected to the so-called internet, they are not servers but clients which are connected to the internet indirectly through internet providers.

Checking and sending e-mail, for instance, is something routine in daily life but we rarely think about how it works. I use my Gmail account—my email client– to send a message to my friend’s email address at, another email client. Once I clicked “send”, would send the email to Then the message would be uploaded to the SMTP–Simple Mail Transfer Protocol–waiting in the outgoing mail queue while the SMTP server communicates with the DNS–Domain Name Server, which works like a phone book for domain names and IP addresses—to find out where is my friend’s email server. If SMTP can’t find the recipient’ server, I will get a “mail failure” notification in my inbox. If it finds the recipient’s server, then my friend can retrieve the message in his/her inbox. Whenever an email picture or webpage travels across the internet, computers break the information into smaller pieces, which are packets. When information reaches its destination, the packets are resembled in their original order to make a picture, message, web page, etc.

“The internet is enacted and performed as an ‘orchestrated combinatorial complexity’ by many actors, agencies, forces, and design implementations in complex physical and material technologies.”. When we view the internet from an engineering perspective as technical layers for networking millions of computers, the internet would not be that complex. As a designed sociotechnical system, it confronts with international political-economic issues. Power is exercised through this internetworked world. It is justified to claim that internet mediates different telecommunications regimes in different countries. In China, most internet users in the mainland cannot access most of the U.S.-based websites like Google (which I remember was accessible when I was a kid), YouTube, Facebook or Twitter. Users basically get information from Chinese-based websites like Sina, Baidu, etc. Online searchers and social media postings are strict. Words that is determined as sensitive or controversial to the government are filtered or deleted immediately right after they are being posted. Mostly either due to the fact that some of the servers are not kept in China (like Google or YouTube), or because of “objectionable” content that the government feels is misleading, or both. After all, whoever is in power determines what is valuable—what the internet is for.


Credits to:

Martin Irvine, The Internet: Design Principles and Extensible Futures

Ron White, How the Internet Works.” Excerpt from How Computers Work. 10th ed. Que Publishing, 2015.

Week 10-Reading Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

I still remember my Dad once told me that one of the coolest things in the early nineties was to see someone holding a “Da Geda (or Big Brother)” in hand, with the long antenna pull out, speaking as loud as possible in the crowd: “Hey! Can’t hear you! Say it again!” Then everyone would cast envious glances at this guy—technically–the “Da Geda” in his hand.

Figure.1 “Da Geda/Big Brother” — Motorola International 3200

It’s big and weighs over one pound and looks like a black brick. Phone call is the only function it has. The connection quality was so poor that people need to yell on the phone. And the battery life is short, merely maintaining a 30-minute call. Yet “Da Geda” was still in great demand at that time. As the first mobile phone entering the Chinese market, it was once a symbol of status because of its high price–basically 25,000 RMB in the late 1980s.

In fact, the International 3200 means more in cell phone history: It became the first hand-sized digital mobile phone that used 2G digitally encrypted technology, evolving from the original analog cell technology developed in the late 1960s. Analog was the 1G used in cell phones. And digital ones are the 2G. Let’s scrutinize the small leap here. Both of them use the same radio technology, but digital phones use it in a different way. Unlike analog system, where signals between the phone and the cellular network cannot be fully used, the digital system can compress those signals and manipulate them easier.  “The trick we do in digitizing is representing in mathematically discrete chunk sequences what occurs in continuous perceptible forms like visual representations and sounds.” So basically, 2G was digitalization of 1G. And digitization is about quantization. Digital phones could convert our voices into binary information and compress it. It’s said that the compression allows between three and ten digital cell phone calls to occupy the space of a single analog call.

Like the question raised in the reading material: “what are the important differences in the media states or formats?” In the case of 1G to 2G evolution, why becoming a digital one is important? For the users, it means data transmission, bigger channel capacity, more secured communication, better voice quality, longer battery life, and smaller size. 2G was a breakthrough but far from a perfect one. It does not allow complex data communication like video. “…the differences in the digital artefacts is its continual openness to software processing and transformations beyond any initial physical or recorded state.” More generations were to come later. Now, 5G is under development, promising superior speeds in most conditions to the 4G network. Our cell phones today are mature enough to process any media forms in a digital way. Texts, images, videos…all kinds of media artefacts that once lived in physical materials did never and will never leave. Actually, digital media gives them an “immortal life” by overexposing them in those black little boxes on our hands. It is true that writing, text, and images have now become more powerful and more widely distributed symbolic forms than ever before. Basically, we are living in the hologram of our own history.

Credits to:

Martin Irvine, Introduction to Symbolic-Cognitive Interfaces: History of Design Principles.

Lev Manovich, Software Takes Command.

Peter Wegner, “Why Interaction Is More Powerful Than Algorithms.” Communications of the ACM 40, no. 5 (May 1, 1997).


Week 9-Reading Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Similar to architecture design, the computer began with a concept—contributing a great user experience—that largely depends on its interface design. At the earlier stage, interface meant anything that physically connects different parts of a system—a point where two systems, subjects, organizations meet and interact. Today the concept basically developed into the interactive, software-controlled screen representations. A good interface design is about allowing for smooth completion of any task and making the experience enjoyable.

Here we take a brief look at how computer interface design has evolved over the past decades. Computers were first designed as numerical and logic processing. The user interface of Batch computers consisted of the input of punched card and users had no interaction with these earlier computers in real time. Since they are designed to utilize the processor to the maximum, it is unnecessary to spend the budget on user interfaces. Later on, computer design began to include graphical elements for cathode ray tubes as display and output interface. The next key interface progression was the introduction of video display terminals that could have users’ command inputs appear on the screen and let them modify those inputs. Then we embraced a new view of “augmenting human intellect” and the very birth of the first GUI developed by Xerox Palo Research Center which has let us to where we are today. The first generation of operating systems, including Xerox Star, Apple Lisa Office System 1, Mac OS System 1, etc., had a windows-based system with icons that had many features that are still in use on today’s systems. Files could be moved to different folders by dragging and dropping on the target icon. Windows could be moved around the screen with the cursor. Here we are in the new era of smartphones when everyone is the software user, interface design started to change significantly due to the popularity of handheld devices–smartphones, which are embedded with telephone and PDA features as well as sophisticated touchscreen and apps. What about the future? Keyboards, mouse, touch and voice inputs are common in both desktop and mobile devices now. Such functionality is likely to evolve with other interface design advancements such as gesture functionality, brain-computer and AR.

Figure1. The Early Mac OS Operating System

All of those future possibilities of futuristic computer interfaces were actually already depicted for million times in sci-fi films. Sci-fi movies are known to be sort of window into the future. Lots of fantastical technologies filmed only decades ago are now everywhere in our pockets or on our desks. Back in 1968, Kubrick made many predictions about man’s future in regard to technological. Despite a few variations, some of the interface designs are already existing in our lives. Glass cockpit displays, electronic tablet (iPad), in-flight personal television, video phone (Skype/Facetime). Hard to imagine the interfaces of those designs look so similar to what we use now in everyday life. I believe even though some of those technologies were not mature enough or even not invented yet, the audience at that time could easily tell what their functions were by simply garnering and interpreting information (text, icons, graphs, etc.) they got from the interface. After all, “the computer is no longer primarily a ‘mathematical instrument’ but a symbol-manipulating system for a human interpreting agent.”


Figure 2. Electronic Tablet in 2001: A Space Odyssey | Figure 3. iPad


Figure 4. Control Panel in 2001: A Space Odyssey | Figure 5. Screen Layout of iPhone


Figure 6. Warning in 2001: A Space Odyssey | Figure 7. Google Security Warning


Figure 8. Status Interface in 2001: A Space Odyssey | Figure 9. Electrocardiogram Monitor

There is a website called Kit FUI that gathers all this cinematic chrome into one place. Interfaces on this website don´t really exist—they are a subset of film’s visual effects—but the example they set about how digital devices could work is a fascinating barometer for user interfaces trends. It seems like all the designers focus on visual aesthetics, adding as many graphs and charts as possible while throwing away as much obscure text as they could. They focus on four things that define the WIMP paradigm (window, icon, menu, and pointing device). As stated in the reading, “the design principles are based on the affordances of pixel-grid screens for rendering interpretable symbols from defined software and hardware functions as either symbolic “content”(rendered text, images, video, etc.) or as action translators (icons, links, gestural controls) “. Most of the designs are appetizing but intuitive and clean because designers know that most web users love with their eyes.


Figure 10. Minority Report | Figure 11. Iron Man JARVIS Wallpaper

Credits to:

Martin Irvine, Introduction to Symbolic-Cognitive Interfaces: History of Design Principles (essay).

Bill Moggridge, ed., Designing Interactions. Cambridge, MA: The MIT Press, 2007.

Lev Manovich, Software Takes Command, pp. 55-106, on the background for Allan Kay’s “Dynabook” Metamedium design concept.

Week-8 Reading Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

“Understanding computing illuminates deep insights and questions into the nature of our minds, our culture, and our universe.”  –Davis Evans

To be honest, I was once one of those who think that computers are technical and lonely. When I was a kid, computers were already designed with fancy interfaces. Kids took all the procedures happens on computers for granted without asking why when you push this button, the game would begin. Its language—how we communicate with computers—is completely foreign to us. Now we know it is because of the beauty of black-boxing. “Computing thinking is using abstraction and decomposition when attacking a large complex task or designing a large complex system”. Wing highlights a lot the concept of abstraction which is actually omnipresent in our daily life. I am now learning Spanish and when I memorize conjugations (pic) of verbs, I am actually practicing my pattern recognition skills. When I try to make sentences, I am following a sequence of grammar commands. Every step I feel like I am analogizing some grammar principles from my mother language or English. It’s all about abstracting the pattern or models from those unfamiliar combinations of symbol.

Example of regular conjugation

Example of irregular conjugation

Learning a language can be the process of following procedures and decoding the arcane symbols. It seems to have nothing to do with computers, but it somehow reflects “abstraction”. Learning something new is about how we process information—how we interpret it, how we generalize it, how we analyze it, and how we conclude it. And computer science is exactly the study of information process. Clearly, computing thinking is a fundamental skill for everyone.

As for natural language, itself is imprecise and ambiguous. It requires learners to be familiar with many unstated assumptions like many verbs conjugate irregularly without a reason. For learners whose mother tongue is from a totally different language system, merely following the description of procedures step by step in grammar books is far from enough, even though authors tried their best to make it precise and detailed. Natural languages are just inherently ambiguous. That’s why we need a more reliable language to describe those procedures, which could be understood and shared by every human being without common sense and assumptions. Back to last class, we’ve learned that information is not entirely equal to abstract knowledge as we thought. It can be quantified. It is something we can measure as its primary unit is a bit and linked to a binary question. The algorithm is a mechanical way to eventually guarantee the process of dealing with information. Taking the Python course in Codecademy is much more interesting than I thought. It is a beginner-friendly language which is succinct and clear enough to imitate/analogize. Learning Python also brings me a sense of achievement for I am not feeling like a passive user of this everyday little black box but an active participant who could speak to the computer. The computer is neither magic nor complicated. It just happened really fast. And it is for everyone.


Wing points out that two main messages need to be sent to the audience, one of which said that one can major in computer science and do anything, even arts. This reminds me of a post-modern literature group—Oulipo, which means Ouvroir de Litterature Potentielle or workshop of potential literature, founded by writers, mathematicians, engineers, etc.. Simply put, that is what’s going to happen when a bunch of computing/math major students decide to write poems. But hopefully, it was not a disaster. It turned out to be an experimental practice in post-modern literature history and even raised a new possibility of future poem production. The biggest feature of this literature group lies in the application of mathematical constraints in poem production. Although poetry and mathematics often seem to be incompatible areas of study, the philosophy of Oulipo seeks to connect them. Oulipian believe some structure and type of form should be set before writing, like using the thoughts of modular arithmetic, combinatorics, graph theory, etc.. Here is a famous Oulipian constraint: N+7. This constraint is to replace each substantive noun in a text with the seventh one following it in a dictionary. I use The N+7 Machine to generate 15 different texts. The original source is my favorite quote from Huxley’s Brave New World: “But I don’t want comfort. I want God, I want poetry, I want real danger, I want freedom, I want goodness. I want sin.” And the results look super awesome:

Does it look like strings of “literature” code that follow certain patterns?

Oulipo uncovers the potentiality of literature, by setting constraints. It somehow underlies the philosophy of computing thinking. Or it’s sound to claim that computing thinking is naturally embedded in everything that relates to the human mind and culture.


David Evans, Introduction to Computing: Explorations in Language, Logic, and Machines. Oct. 2011 edition.

Martin Campbell-Kelly, “Origin of Computing.” Scientific American 301, no. 3 (September 2009): 62–69.

Jeannette Wing, “Computational Thinking.” Communications of the ACM 49, no. 3 (March 2006): 33–35.

Week 7-Reading Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

This week’s readings are dense for me, especially the mathematical part of the information theory. But it is still a rewarding process for refreshing my original knowledge of “information”.

Imagine we have an idea in mind. There are multiple choices to express this idea: painting it on the wall, writing a song, sending a telegraph, posting it on Facebook, etc. They are different forms to express the same idea–the same information. Why are they the same? If we want to prove vapor and ice are essentially the same, we will probably list chemical elements they got and compare them. But information is different. It is commonly used so metaphorically or so abstractly in daily life that few of us can tell its exact meaning under a technical context. Are there any fundamental “particles” of all forms of communication? Can we measure information scientifically?  Those are something magic that Shannon shows us in Information theory, in which he applies mathematical formulas to strictly measuring the amount of information, reflecting the statistical nature of information expression. Similar to measuring the mass of different objects. No matter it is water, rock or human body, we can use a standard measure such as kilograms to measure it and make comparison accurately. What Shannon did allows us to precisely measure and compare information using a measurement called “entropy”. With this information scale, we intuitively know that some hieroglyphics on the wall has the same information with a page in an unknown book, a piece of music and some unreadable codes since they all contain the same number of bits. Every bit is linked to a simple idea of answering yes or no questions to measure average uncertainty, which is entropy(?), as well as the most powerful invention of human history — language/sign and symbol system.

For the transmission model, as clearly shown in Shannon’s original diagram, there are six basic elements: an information source which produces a message, a transmitter which encodes the message into signals, a channel through which signals are adapted for transmission, a receiver which reconstruct the message from the signal, a destination where the message arrives, and a dysfunctional factor–noise, which might interfere the travel of message along the channel. In conversation, one’s mouth would be the transmitter. The signal would be the sound waves. And the other one’s ears are the receivers. The noise might come from others’ distractions. For telephone, the channel is a wire, the signal is an electrical current. The transmitter and receiver are the telephone handsets. The noise might include the static or crackling from the wire. As for the mobile phone in my hand, it converts my voice into electrical signals, which is further then transmitted as radio waves and converted back into sound by my friend’s phone. Parallel to Lasswell’s model of communication–“who says what in which channel to whom with what effect?”, this transmission model vividly depicts a commonsense understanding of what communication is.

“This model provides an essential abstraction layer in the designs of all electronic and digital systems. It does not provide an extensible model for the larger sense of communication and meaning systems that all our post-digital symbolic-cognitive technologies allow us to implement”. The transmission model has strengths in its simplicity, generality, and quantifiability, yet followed by weakness in its misrepresentation of the nature of human communication. First, it is a highly mechanistic model that based on “conduit” and “container” metaphors. In those metaphors, the communicator put ideas into words, which are containers in this sense, and send them to others who take the idea out of those words. This process is quite like transporting goods. But thoughts and feelings are not real “objects” or goods and language cannot function exactly like a conduit since language could be interpreted to different meanings. The whole process of communication is based on biased assumptions regarding language in this theory. If this view of language is correct, learning something new will be not that hard since knowledge will be absorbed accurately and cost no effort. Also, the model is linear while communication is not one-way. The receiver might have feedback and further influence communication. Further, this model assumes that communicators are isolated individual communicators with the same social roles and power. Yet in reality, communication is a shared social system, and components in it are social beings with different roles, which means not all meanings possess equal value. For instance, if my friends ask me how I feel about the recent study, I am more likely to answer in a somewhat different way from the way I might answer the same question from my professor. Overall, this transmission model assumes communicators are isolated individuals, with no allowance for differing purposes, alternative interpretations, unequal power relations, and situational contexts. All of those constraints make it insufficient for extending to models for meaning systems. As noted in the article, “the semiotic dimensions of information theory are always there, but formally bracket off from the operational focus of electrical engineering and computing data designs.”


Credits to:

Martin Irvine, Introduction to the Technical Theory of Information

Luciano Floridi, Information: A Very Short Introduction. Oxford, UK: Oxford University Press, 2010.

Peter Denning and Tim Bell, “The Information Paradox.” From American Scientist, 100, Nov-Dec. 2012.



Weekly Response – 6

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Here is an underlined text. The first thing we do unconsciously is to click it because it seems to be a hyperlink to an external website. But this link will be a mystery for those who have not encountered a hyperlink before. So we as designers had better improve the interface of hyperlink like this: Click here 🙂 This visual and interpretable design will work for most of the people. When we actually click it, we will find it doesn’t work though. There is a gap between perceived affordance and its actual affordance. Here is another one: Click here 🙂. This time it affords the function of a hyperlink, which leads us to a website. But the only thing we could do with this hyperlink is to click it to browse the new page, or not. It cannot afford other actions like being removed with a simple click. That is the constraint of this design.

Through the hyperlink practice above, we see the completion of affordance as well as its flipside. Both actual and perceived affordances must be well considered in the design. Or the user will feel the gap which leads to the failure of design. “…affordances, both real and perceived, play very different roles in physical products than they do in the world of screen-based products.” A user’s perception and understanding of affordances might vary according to their ability, goals, cultural backgrounds, context, and past experiences.

The hyperlink experiment reminds me of the ongoing debate about “printed newspaper versus online news website”. Online newspaper abounds with countless hyperlinks which lead readers to relevant news based on their reading history; yet newspaper constrains reading content for it is a physical medium with limited space and specific date required. The amount of information they could cover is just one aspect to compare affordances of them. Like any other media artefact, the newspaper has a form–an interface. This form varies according to the layout, design, illustration styles, schemes of departmentalization, etc.. All of those aspects influence reader’s experience and affects their affordance to work.

Image source: The Washington Post

To be more specific, first, the physical attribute of print newspaper affords discussion and interaction in reality. For printed newspaper reader, the experience will be more comfortable when they seat in the armchair or sofa. With print newspaper at home, an open space to share the news and discussions, readers tend to share opinions directly with others who are co-present and find body-to-body company. The physical attribute of printed newspaper affords an enjoyable reading experience in a less mobile world and allows more possibilities to interact with people around you. Yet those affordances have flip sides. Nowadays comparatively large size of print newspapers are not designed for easy reading on the move. To read them, users have to fold the paper, which reduces the visible surface. For online news readers, they might find online page more flexible owing to Web 2.0 tools that enable more dynamic and interactive structure. Their opinion sharing experience with families or friends might be less immediate than the printed newspaper, but online newspapers allow asynchronous sharing of information with internet users on the social network.

Image source: The Washington Post

Plus, being different objects–one analogue and the other digital–print and online newspapers show various of uses. Online news webpage only affords reading and functions related to news. All of those functions are digital objects–they are immaterial. But print newspaper as a material object, it affords not only immaterial function like reading, but also material ones. It is fascinating to see people reinvent the design of newspaper and practice different uses–lighting a fire, wrapping for a gift, even for artistic practice like collage or cut-ups.

Image source: Taylor Houlihan

Besides, both of print and online version affords the function of advertising. In printed one, it might be a work of art or a poster while in online it has a form of banner, pop-up, link, images, etc.. The constraint of printed one is that audience could not get further details of certain advertisement as they could get from online newspapers.

Image source: The Washington Post

The comparison could not be a good vs bad, digital vs. analog dichotomy. When we distinguish the differences we also need to sort out the underlying continuities in those two artefacts. As Prof. Irvine stated in his article, “we live at cultural moment where ‘traditional’ pre-digital media artefacts co-exist in a continuum with digital media, and where much in the digital media design world shares or translates affordances from prior forms. ” In the case of newspaper comparison, we should also take a more broad and inclusive perspective.


Credits to:

Martin Irvine, “Introduction to Affordances and Interfaces.”

Janet Murray, Inventing the Medium: Principles of Interaction Design as a Cultural Practice.
Cambridge, MA: MIT Press, 2012. Selections from the Introduction and chapters 1-2.

Donald A. Norman, “Affordance, Conventions, and Design.” Interactions 6, no. 3 (May 1999): 38-43.



Week-5 Response

Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Latour’s system thinking is applicable to any studies of sociology or science. The term socio-technical system is to describe the system that involves a complicated relationship between people, machines, and context. Quoted from last class, “Any division between ‘humans’ and ‘computers/machines’ or ‘culture’ and ‘technology’ is false”. Similarly, any division between “human societies” and “technologies” is false. Even though computers or machines have “instrumental” function that makes them be used as a tool, we could hardly detach them from our collective life, which consists of interconnections of various parts but exists as a wholeness, a continuity, a technical social lived environment. “…within a sociotechnical system, artefacts and technologies are not inert objects, but become part of networks of distributed agency or interagency”.

Here I want to share my favorite paragraph in Dr.Irvine’s article: “The mistake of the dualist paradigm was its definition of humanity …They deserve better. They deserve to be housed into our intellectual culture as full-fledged social actors. They are us.” The debate between technology vs. society dualism and integrative views always reminds me of Blade Runner ( Ridley Scott, 1982). It depicts the symbiotic relationship between human and technology by representing it through the existence of replicants–human-like androids created as workers, slaves, living among human, but who adapt themselves to social context and begin to have feelings, memories, and emotions. Machines intermingle with human, and blade runners have a real hard time hunting them for they have their own life history and become difficult to distinguish from human beings. “They are us”. Detecting technological doubles could somewhat be viewed as a self-detection. Disturbing discussions upon the relationship between technology and human society are omnipresent in sci-fi films.

Blade runner, 1982

Back to the sociotechnical system. The most essential premise of socio-technical thinking is that system designers should consider both social and technical factors that might impact the functionality and user experience of a computer-based technology. Or to put into another word, designer should take socio-technical approaches otherwise the system they design will probably not reach the expected goal of the organization. If we separate technology and the environment as opposite domains, we will neglect the complex relationships between the organization, the people enacting business processes and the system that supports these processes, which lead to the failure to deliver expected support for the real work. Thus, an integrative system view is necessary to avoid possibilities of that failure.


Basically, every technology we are using today were initially born as an interagency and extended or distributed cognition. It will not be that perplexing to understand if we take a closer look at our daily life. Cleaning robot–the very first thing off the top of my head. My mom is a neat freak and she bought various robot cleaners to clean our house. She always thinks they are one of the greatest inventions in the world because those robots can literally travel through any room any corner and are small enough to fit under the couch or beds. And most of all, they are easy to operate. Every time she wants it to stop, she will say “go home” as an instruction which could be recognized and processed by the cleaner. Then the robot returns to its home–a charging station, and my mom would say “good boy/girl”. I always find the interaction between my mom and her robots ridiculous because she kind of views them as her pets or something alive. Yet It is also undeniable that robot cleaners are really good helpers in several ways: solving mundane tasks, refreshing my mom’s knowledge of latest technology, and being a member of my family:) Anyway, socio-technical ideas are increasingly applicable in home technologies, particularly smart home technologies which are developed for the design of inter-dependable domestic systems. They deeply adopt a socio-technical view in which the system comprises the user, the home environment, and the installed technology. Celebrities homes are perfect examples of what personalized smart home system can look like. In Oprah’s high-tech home, there is a radiant heat system keeping the driveway completely snow free. Bill Gates has a system to connect visitors’ devices to the smart house technology, which includes controlling temperature, lighting, and music.

One more word about the cleaning machine. If it is a techno-centric robot, without a friendly human-machine interaction (voice recognition), symbolic interface (like perceptible icons that direct to separate functions), my mom will never feel close to a “cold” machine. Another example is my 4-year-old niece fell in love with her robotic toys and can’t leave it even for one moment because, as she claims, they are best friends. Her baby toy performs therapeutic functions to give the girl intimacy she needs: singing songs, telling stories, comforting feels, doing funny moves. For her, all these automatic functions means something. Similar to my mom’s case, the interaction process seems to be like the robot sends messages, and the girl receives them, make a response and becomes happy. The robotic characters seem to cause people to have a relationship with technology. The robot is no longer a machine but the emotional sustenance for the girl. Is it underlying mediology here? Can we view robot as a new form of media? Can it represent a radical new form of mediated information and agency?

Credits to:

Martin Irvine, “Understanding Sociotechnical Systems with Mediology and Actor Network Theory (with a De-Blackboxing Method)” [Conceptual and theoretical overview.]

Pieter Vermaas, Peter Kroes, Ibo van de Poel, Maarten Franssen, and Wybo Houkes. A Philosophy of Technology: From Technical Artefacts to Sociotechnical Systems. San Rafael, CA: Morgan & Claypool Publishers, 2011.

Bruno Latour. “A Collective of Humans and Nonhumans — Following Daedalus’s Labyrinth,” in Pandora’s Hope: Essays on the Reality of Science Studies. (Cambridge, MA: Harvard University Press, 1999), 201.