Author Archives: Reid Wang

Research on designing graphical programming language

Reid Wang

Abstract

As the bridge between human beings and computers, programming language is designed by computer scientists to replace the obscure machine language. Compared to binary code, programming language, thanks to its new features such as the application of natural language words and grammar, greatly enhance the efficiency of human – computer interaction.

However, for most computer users, the existent programming languages are still too abstract and difficult to understand, while the necessity for customizing functions has never disappeared. Further, the development of software links every modern industry with computer science, thus making higher requirement to citizens for better understanding of programming language.

This paper intends to discuss whether graphical programming language, as a possible form of future programming language, can help ordinary users study and use programming language in a more friendly and riveting way by analyzing the key principles of designing programming language that is valuable for daily use.

Introduction

From vacuum tubes and transistors age to integrated circuits age, the computing power of computers has ballooned during the short 70 years. Computer itself also evolves from the gigantic machine occupying a whole room to the laptop and tablet that can be carried by people anywhere. However, no matter what form in which computers appear, the basic principle of electronic computer design has never changed. Compared to the first electronic computer born in Pennsylvania, though modern computers have already been manufactured with new technologies including graphical operating system, highly interactive software and powerful self-learning ability that can not be imagined by people several decades ago, they still can not work without the combination of 0 and 1 representing the basic logic unit like “and” or “not”. So the problem is that computer is essentially a machine with unique mechanism based on binary code which is totally different from human beings’ natural language. Although the early computer scientists can make instructions to computers using binary code directly, it is impractical for every developer to learn such kind of thing not only because of the high leaning cost but also the complexity of modern software. Therefore, a new form of language that can both embody the logic of computer and contain the features of natural language is needed. That is programming language.

This paper will discuss the relationship between programming language and graphical design. On the whole, this paper will be divided into four main parts. Part one will focus on computer and programming language, including the computation mechanism of computer system and key features of programming language. Part two will expand the topic to the relationship between computers and human beings as well as the information flow from machines to human beings. Part three includes the application of design principles in designing graphical programming language with a few cases. Part four will talk about the social and business impact of popularizing graphical programming language.

1.Programming language and computers

1) Some basic concepts
Before meticulously researching the new form of programming language, it is imperative to talk a little about the execution process and working mechanism of programming language. Most of computer users have heard that computers are based on binary code, but few of them really understand what “binary” really means.

One critical concept about binary system is Boolean algebra. This theory introduced by George Boole describes logic system in a mathematical way and lays foundation for the binary system of modern computers. The core part of Boole’s theory is the variables with two possible values representing true and false respectively. Therefore the system consisting of n variables can generate 2n possible states. A similar system is Morse code which uses dot and dash to represent English characters and numbers. Back to modern computers, by controlling the value of each logic unit, computers can execute complex instructions since the billions of transistors integrated in a CPU can combine with each other to produce innumerable possibilities.

morse_listening

A binary-tree model to illustrate the mechanism of Morse code

Programming language itself just translates the binary code to people and people’s words to computers. Just as we have to combine words and words together to explicitly express what we mean, we need a collection of certain programming language words for executing our instructions and that is program. The translation process is also executed by a program called compiler. According to the classical book about compiler, Compilers, Principles, Techniques and Tools, compiler is defined as “a program that reads a program written in one language – the source language – and translates it into an equivalent program in another language – the target language”.

Though all programming languages serve like translators between human beings and computers, considering the gap between binary code and human beings cognition, the programming languages with more features of human beings’ natural languages are easily accepted by learners in practice. However, the efficiency of a programming language is usually inversely proportional to its legibility.

2) Key features of programming language
Today one of the most famous disputable topic among programmers is which programming language, from the most complex ones like C++ to the relatively simple ones like javascript, is the best one in the world. It is hard to rank the mature commercial programming languages because every language has its own pros and cons. But there are some common features of prevalent programming languages and those features are determined by computer itself.

  • Natural-language-based

In light of the uniqueness of computer’s logic, the mature programming languages are almost based on human beings’ natural languages, especially English. It is not difficult to understand why to say so. For users, there is no need to describe the working process of computers. For example, users are not interested in what happens in BIOS or hardware when they start up a computer and it is enough to show them where power button is. To eliminate ambiguity, a battery-like icon is often presented besides a power button. For developers, programming language allows them to input single words to realize complex functions. Like the power button, programmers only need to call certain key words instead of exactly knowing everything happening within CPU, memory and hardware. In a simple program like “Hello World”, every word has its own meaning and the meanings can be easily accepted by learners because they are tightly related to their original meanings in English. For instance, the key word “printf” just means printing certain contents on screen.

360%e6%88%aa%e5%9b%be-381178171

Classical “Hello World” program in C

The relationship between programming language and natural language can be explained reversely, too. Natural language helps programming language build its meaning system and programming language in turn helps computers understand what words of natural language mean. As mentioned above, Morse code adopts a special way to simply signify characters and numbers. The way to make computer understand words and numbers is similar. An encoding system, like ASCII, will construct mapping relationship between words and special code that can be read by computers, such as binary code or hexadecimal code.

  • Modular

If we really begin to learn a main stream programming language, we can find that most of them, no matter what perspective we use to view them, is black-boxed and modular-designed.

First of all, most programming languages are based on functions containing relatively independent code called code blocks. Branch statement, of which form is if A, then B, else C, is a great example. In program, A, B and C are clear because each part will be strictly enclosed in brace. Maybe programmers still have to write code line by line, but it is much more convenient for eliminating bugs because by modularizing each logic part, programmers can check the programs block by block instead of word by word.

What’s more, a program can not run without the support of operating system. That is why software developed for Windows can not run on Mac os. To be specific, the code inputted on visible interface itself does not mean anything to computers because computers are not manufactured with recognizing key words of popular programming languages. Actually, what stipulates that “printf” means printing words on screen or “int” indicates integer is exterior files called head files. In the above example, what makes key words like “printf” work is the head file “stdio.h” listed at first. For programmers, it is unnecessary for them to know what is contained in the head file (in fact stdio.h is about standard I/O function). Common head files together constitute standard libraries. Obviously, standard libraries only tell programmers what is available to them, but not why it is available. That is why program is black-boxed.

  • Hierarchical

No matter what language we use, ultimately programming is about communicating with computers. People themselves do not have the ability of controlling electronic states of transistors directly. Therefore, computer is a huge black-box system for human beings.

360%e6%88%aa%e5%9b%be-371592890

Natural language to machine langugae – interface tp hardware

Machine language is the language of hardware and natural language is the language of human beings, each representing a different logic. A programming language with more features of natural language can be understood by people more easily but computers will spend more time converting it into machine code because calling standard libraries and interpreting syntax can be time-consuming. Low-level programming languages that are close to hardware, like assembly language, are often highly efficient but can hardly understood by people. From this perspective, it is reasonable to say that programming language is hierarchical.

2. Human – computer interaction

1) Information flow
Shannon’s traditional information theory has already built a model for analyzing what happens when people communicate with computers. For modern computer users, they are accustomed to receiving information from the pixel-based screen. However, the problem is that information theory can not explain how brain processes information since the destination of information – human brain is essentially a black-box system in information theory. Another serious flaw is that information theory ignores the effect of information form.

360%e6%88%aa%e5%9b%be-56969578

Shannon’s information theory model

In fact, two things interesting of Shannon’s model about programming is exactly the information source part and destination part. The former one is about computers and interface and the latter one is about human beings.

For human beings, the form of information can profoundly influence the final effect of communication. A famous theory concerning this is from Neil Postsman, who regards media as metaphor. To be specific, Postsman criticizes that TV, as a new form of media, distracts people from paying attention to content compared to newspaper. The statement, however, to some extent indicates that images are more attractive to human beings.

2) Human – computer interface
Now that programming language is designed for people and used by people, the design principles used for daily objects are also applicable when evaluating a programming language. Just as natural languages which update every year with thousands of new words and grammars, programming languages also head towards the direction of supporting more key words, functions and libraries. However, what happens with the development of programming languages is that learning and using programming languages is not easier than decades ago. On the contrary, the operating systems, from DOS to Windows, greatly lower the cost of using computers for people.

Compared to DOS, Windows 95, the first generation of Windows operating system that can work independently, introduced a brand-new way of communicating with computers. Users don’t need to input word-based instructions and wait for feedback shown on monochrome interface, instead, in order to implement certain function, they only need to click buttons or icons with clear words or images. The following version of Windows operating systems optimize user experience, but never overturn the form of graphical interface. For programming language, the history of operating system at least indicates one thing that graphical design may help users better understand what they can and should do when they contact a new product. Therefore, graphical programming language has the potential to revolutionize the way people study computer science and develop software.

pc_dos_1-10_screenshot

cmwindows95-jul15e

8-start1

From words to graphics – the history of Windows interface

3. Designing graphical programming language

1) Interface design – affordance, constraint and feedback
To design a graphical programming language, the first step is to design an interface that can clearly tell users what to do and what they can achieve. For programming learners, two difficult things is remembering what key words mean and designing a proper algorithm for certain goals. So for graphical programming language designers, they have to meet the basic requirements from users.

Blockly, the online graphical programming project developed by Google, makes a good example to solve the problem. The whole interface of Google Blockly is divided into three parts. The left part provide users with selections of programming modules available for building their own projects. To help users understand the effect of available modules and find out the modules they need quickly, designers of Blockly categorize all modules according to their function. The middle part is the main area that allows users to constitute their own programs. By dragging the modules and modifying values of the parameters in the light-colored areas, users can freely decide what their programs are like. The right part just shows the equivalent source code. For users who are interested in learning basic concepts in a more graphical way, the source code can be helpful.

Just like Lego, Google Blockly offers similar affordance, constraint and feedback to users. By observing the margin shape of each module and reading the instructions, users can establish preliminary impression of programming. When a module is dragged to the right location that can make the whole program work, it will shine and create special sound effect. To prevent users from making mistakes, module will not make response to users when it is placed at wrong place.

%e5%9b%be%e7%89%871

Interface of Google Blockly

Considering one of the most important characteristics of programming language is modularity, the interface design of Google Blockly is perfect for people to understand what modularity means. In fact, a good design for graphical programming language interface not only should be user-friendly, but also should reflect the features of object programming language.

2)Gamfication
One feasible strategy for designing a graphical programming language is gamfication. Of course, gamfication does not mean designing a game but absorbing the advantages of game as a new form media that create a sense of immersion, which can be explained as “not interrupting us all the time to tell us it does not matter”.

So the first question is what is game what makes game different from other forms of media. Generally speaking, game cab be defined as “a problem-solving activity, approached by a playful attitude” by Jesse Schell. If we narrow the range down to screen-based games, we can find what makes game intriguing and playful is its interaction with people.

Here another question emerges – what does interaction mean to players? To answer this question, Richard Bartle comes up with a model that divides players into four main types – killers, achievers, socialists and explorers. For players, Although Bartle’s system is initially used to explain the players’ psychology in MUD(Multi-user dungeon) games, considering the interaction style of games does not intrinsically change, Bartle’s theory is still valuable for researching modern games.

bartle

Bartle’s theory of players

Back to gamfication of programming language, the first thing we have to do is to figure out what role programmers or learners play in Bartle’s system. No matter full-fledged programmers or inexperienced beginners, what they face is unknown and waited to be created. Therefore, we can easily categorize them as explorer. What’s more, gamfication means response from computers is important as well. Considering this, taking users of graphical programming language as achievers is necessary.

So now our goal is to design a fully interactive and immediately respondent programming language with attractive interface, of course. Here is a great case of a programming language that meets all these requirements – Scratch.

20130514110054-1_0_0

Interface of Scratch

Scratch is an interesting teaching programming language developed by MIT. Just like Google Blockly, it adopts the Lego-like design to reflect the inner logical structure like loop or branch in the program. What is different is that it does not strictly simulate the traditional programming languages but uses a pseudo-code and natural-language style to create interactive effect. In the example shown in the above picture, one amazing thing is that the property and action of the cartoon character, whose parameters can be adjusted by learners, is labeled with different colors. By doing this, learners can quickly understand the definition and meaning of statement or function. The execution result of the Lego-like code is that the animate characters can move, stop or change costumes precisely according to what learners have inputted.

As mentioned above, users of graphical programming languages are best regarded as explorer and achiever. Apparently, the users of Scratch can easily be motivated because their work can be directly reflected as an animation that can only be achieved by proficient programmers without Scratch. Also, Scratch provides users a complete community service allowing users to upload their own projects, thus encouraging learners to explore more possibilities using Scratch language.

360%e6%88%aa%e5%9b%be-435241656

Scratch’s powerful community

3) Efficiency
There have been many graphical programming languages that focus on learners and light users, like product managers and UI designers, who have the demand for writing short scripts occasionally, but professional programmers, hackers and computer science students still prefer to program in old way. Be it Blockly or Scratch, those graphical programming languages are designed as teaching tool instead of production tool. Compared to traditional programming languages, the existing graphical programming languages can not solve some problems like:

  • Low efficiency of complex program

Low efficiency of graphical programming language can be explained from two perspectives. On the one hand, graphical interface means calling more exterior functions, in other word, involving more black-box systems. It will definitely lower the efficiency of executing program. On the other hand, the industrial programs can be hundreds times as complicated as the programs developed by graphical programming languages. It will be inconvenient for programmers to read because too many geometric figures can distract programmers from what the program is really about.

  • Programming is not all about programming languages

A prevalent misunderstanding people have of programming is that learning programming language equals with learning programming. It is ridiculous to say that anyone who knows English is novelist and that is the same to programmers. Graphical programming language may be able to help learners understand the basic concept of Boole algebra, but it can not teach them how to use it. Therefore, graphical programming language itself is not enough to help people understand programming and computer science.

Graphical programming language is an excellent teaching tool but not a great production tool now. To develop graphical programming languages that can replace traditional programming languages, designers have to jump out of the circle of existing programming languages. However, the co-existence of graphical programming languages and traditional programming languages may be the best situation considering the development of computers.

4. Social – technical system

1) Computational thinking
Although graphical programming language itself is not enough for anyone who aspires to enter IT industry, the popularization of it can propel people to form attitude of computational thinking, which is interpreted by Jeanette Wing as “computational thinking involves solving problems, designing systems, and understanding human behavior, by drawing on the concepts fundamental to computer science”.

So how to explain “ the concepts fundamental to computer science”? Back to the learning process with Scratch language. During the learning process, learners will observe, experiment, analyze, summarize and introspect. Also, to realize the object like “making the character head upwards for three steps in yellow costume” , they will learn to break down the conundrum into some sub-problems like “head upwards”, “three steps” and “yellow costume”. In general, computational thinking is an intelligent, rational and efficient way of thinking.

Graphical programming language unveils the mysterious programming language to ordinary people. We do not need everyone to be eminent programmer who can finish a complete project independently, but computational thinking should be accepted by every modern civilian.

2) Non-elitism
Another interesting thing relative to the popularization of graphical programming language is that user-friendly interface and appealing interactivity can effectively lower the barrier for developers, or more precisely, small-scale developing teams or individual developers. Maybe those developers are incapable of developing any large software targeting millions of users, but the opportunity for them is that need can be personalized. Sometimes the need can be so specific or minor that big companies often ignore the voice from those users. If we browse the plug-in center of Chrome, we can find many functions beyond our imagination.

Under such a circumstance, developers can be users themselves. Users with peculiar needs will develop small program or write a few lines of scripts themselves and then share with others online. For those developers, they don’t need to learn computer science courses systematically. So the best programming language for them is the simplest and most visualized one.

I would like to call the emergence of individual developers or non-proficient developers non-elitism in Internet age. Non-elitism means that anyone who has special interest can develop his or her own application, build personal website or create art work, thus forming community with single topic and strong user engagement.

Conclusion

As a form of language that plays important role in human-computer interaction, programming language guides people how to communicate with computers and de-blackbox the complex digital system in our life. However, the abstraction and complexity of main stream programming languages prevent ordinary people from learning them. Graphical programming language, compared to traditional programming language, is accepted by ordinary people more easily because of its clearness and interactivity in education field. Nevertheless, it is still hard to make verdict on the future of graphical programming language in working field.


Reference

Adams, Ernest. “The designer’s notebook: Postmodernism and the 3 types of immersion.” Retrieved 1.5 (2004): 2015.

Aho, Alfred V., Ravi Sethi, and Jeffrey D. Ullman. Compilers, Principles, Techniques. Addison wesley, 1986.

Anderson, Chris. “The long tail.” Wired magazine 12.10 (2004): 170-177.

Arthur, W. B. (2011). The Nature of Technology: What It Is and How It Evolves (Reprint edition). New York: Free Press.

Bartle, Richard. “Hearts, clubs, diamonds, spades: Players who suit MUDs.” Journal of MUD research 1.1 (1996): 19.

Bodker, Susanne. “When second wave HCI meets third wave challenges.”Proceedings of the 4th Nordic conference on Human-computer interaction: changing roles. ACM, 2006.

Boole, George. An investigation of the laws of thought: on which are founded the mathematical theories of logic and probabilities. Dover Publications, 1854.

Bryant, Randal, and O’Hallaron David Richard.Computer systems: a programmer’s perspective. Vol. 281. Upper Saddle River: Prentice Hall, 2003.

Fangohr, Hans. “A comparison of C, MATLAB, and Python as teaching languages in engineering.” International Conference on Computational Science. Springer Berlin Heidelberg, 2004.

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

Manovich, Lev. Software takes command. Vol. 5. A&C Black, 2013.

Norman, Donald. The Design of Everyday Things: Revised and Expanded Edition. Rev Expedition.
New York: Basic Books, 2013.

Postman, Neil. Amusing ourselves to death: Public discourse in the age of show business. Penguin, 2006.

Prechelt, Lutz. “An empirical comparison of seven programming languages.”Computer 33.10 (2000): 23-29.

Rochkind, Marc J. Advanced UNIX programming. Pearson Education, 2004.

Schell, Jesse. The Art of Game Design: A Book of Lenses. 2nd edition. Natick: A K Peters/CRC Press, 2014. Print

Shannon, Claude Elwood. “A mathematical theory of communication.” ACM SIGMOBILE Mobile Computing and Communications Review 5.1 (2001): 3-55

A case study of an online test prep website – Magoosh

By Xiaoyang Wang and Galib Abbaszade

One of the most important stage for enrollees (potential students) to be admitted to Universities is successfully passing test exams and getting required scores. Utilizing Internet power and capability, Bhavin Parikh, CEO of the company, and three his companions launched Magoosh on-line tutorial portal in 2009, which is focused on preparation for test exams – GRE, GMAT, TOEFL, SAT, etc.

360%e6%88%aa%e5%9b%be-96242406

Interface design as cognitive artifact – Minimalism and flat design

The home page of Magoosh is a good example for user experience design. To explain why it gives users such a deep and direct impression, it is necessary to answer some questions at first:

  • Why do users want a website like Magoosh?
  • What do users expect to learn from Magoosh?

360%e6%88%aa%e5%9b%be-214351484

These two questions are easy to answer. Actually, be it Educational Testing Service(ETS) who designs TOEFL and GRE test or Graduate Management Admission Council(GMAC) who designs GMAT test, students are hard to get enough practice only with official guidebooks or questions sets and as well are unable to get enough information to make summary. Therefore, they need someone to provide them with what they need to know to prepare for those exams. After figuring out why users want a website like Magoosh, the answer for the next question is clear: users need to know the category, quality and quantity of information that they can receive.

Then let’s check the definition of minimalism and flat design. Generally speaking, flat design is the application of minimalism, which intends to leave users as little as information. The features of flat design include the utilization of pure-colored block and regular geometries. A famous design example of flat design principle is Microsoft’s Metro Design used in Window 8 and Windows 10.

win8start-screen_lrg

As I mention above, the expectation of Magoosh’s users is simple. The flat design style just clearly show users the category of tests, which is definitely the things users mostly care about. It is natural for users to type in keywords like “GRE”, “online test” or “practice” in Google, so selecting names of exams and place them at the most conspicuous location is a perfect choice. In other word, it is a great example to show users the affordance, telling them what Magoosh is for. Other information presented on the home page like “100 million questions” and “2 million hours of video lessons” is exactly what users are interested in too.

Modular design with self-adaption algorithm

360%e6%88%aa%e5%9b%be-225061296

From Persian language Magoosh means wise, highly-learned and generous one. This interactive portal is designed by combining modularity and abstraction principles to provide users with certain services by using both technological features and accumulated knowledge and experience gathered from previous tests takers and tests organizers. In general, designers of this portal did not create something new, not any single part of the whole system. Rather they wisely used already existing hard and software affordances to construct the whole portal “building” from the available construction blocks, such as searching engines, communication and computational devices, commonly accepted media symbols, photo and movie appliances, etc.

360%e6%88%aa%e5%9b%be-230576687

Once the whole portal was constructed from these “blocks” they “breathed” life to its functioning by uploading it with knowledge gained from previous cognitive experience of organizations or individuals who were affiliated to the test takers process. Based on this knowledge they could designed this portal as an interactive application which has ability to define the level of test taker knowledge and propose recommendation for further preparation period. Also, its “brain” algorithms make possible to complicate assignments momentarily reacting to accuracy rate of a test taker. This progressive and regressive evaluation approach for answers accuracy helps to provide test takers with the same condition which is supposed to be at the real exam.

360%e6%88%aa%e5%9b%be-230454843

2012-11-23-cat

360%e6%88%aa%e5%9b%be-231129656

Brilliant App with affordance and feedback

This portal is the best example of how symbolic technologies and cognitive artifacts are combined altogether to improve preparation process and apply more individual approach for each test taker. There are perfectly tuned computational and math software and algorithms support each abstraction layers. The engineers of the site immensely use graphics, images and other digital media tools to organize to organize the test preparation process in more practical way. To make the preparation process more friendly, interactive and attractive, the designer of the portal created very useful interfaces and affordances tools.

360%e6%88%aa%e5%9b%be-231853203

To increase accessibility of customers and provide them with the options to use the portal capacity, Magoosh company designed the phone application in 2014. Using modularity design principles they could adopt the complicated test preparation process for the smart phone users and give them a chance to save their time by memorizing words for verbal section or math formulas for analytical section of the chosen exam.

3yfqjnh60luewppf7fngqc4a0kxs3qjitydj-thbsbtlyhcgrd8vw-8sdnzjyb7_ujph900

In general, the whole preparation process is huge field to test different type of semantic mechanisms and programs to evaluate the accuracy of test takers. Also, it is a good chance to customize various of symbols and signs to help test takers perform and train quick reaction to the questions which should be answered within short time frame, usually about 50 seconds per each. Considering that all testing exams have transferred to be taken through Internet interactive programs, it gives Magoosh more chances to increase the number of its clients having the same approach and mechanisms for tutorial reason.

hqdefault

Social-technology system with profound impact

From social implications points of view, this site brings more equality and equity to range of students with different backgrounds, financial opportunities, accesses to the source of knowledge, opens broaders for international students to compete each other, what leads to rising of the average cognitive (GPA and IQ) level of students in each University. Being relatively cheap comparing with intramural type of tutorial courses, it makes possible for enrollees with low income to get access to better international schools. This site does a good job by giving stage to alumni of the preparation program to share their ideas with new enrolled students. Social aspects of the site are implemented through such links like “press”, “blog”, and being opened from other social networking portals. Students with technical background using this tutorial site may improve their knowledge in English language grammar and those who has humanitarian education can upgrade their skills in math and fast calculation. Also, it is globalizing education process giving a chance for students from different continents and countries to interact and study at the same Universities, to know more of each other and keeping up international relations.

360%e6%88%aa%e5%9b%be-232347218

Web browser – users, Internet and interface

It is always a hard task for designers and product managers to decide what functions they should offer to users. Interfaces of web pages or applications decide the first impression of users and their will to learn more. Here I would like to talk about web browser and its design principle involving Internet access.

1. Don’t make me think
Generally speaking, web browser itself is an application for accessing contents presented on web pages. From this perspective, users expect some products that can react immediately and indicate what exactly they can see with Internet connectivity.

Therefore, the basic function of a web browser is to serve like a bridge between users and web pages they intend to see. For almost all web browsers, one of the most important parts of interface is the address bar. To most users, what they need to do is just remembering the domain names like youtube.com or google.com. One convenient thing about address bar is that without top-level domains(TLD), such as .com, the most commonly-used one, and .cn, the TLD especially for Chinese websites, most web browsers can convert what users type in into the key words of default search engine.

Another important function for web browser is to support multimedia. Most mainstream web browsers allow us to view the details of web page layout based on HTML language. Although what show on the interface is hard to understand, at least we can learn that texts, pictures and videos are integrated in one web page in a modular way. For example, when I check the source code of WordPress page, it tells me the source address of the inserted video and parameters like width and length that are related to its format.

360%e6%88%aa%e5%9b%be-494847000

If we study more about the working mechanism of web browser, we can find that browser is essentially an interpreter. It sends requirement to remote servers, receives feedback data encapsulated in packets and calls local APIs to render the pages. Of course, for users what they only care about is the efficiency of finishing the whole process, which is directly related to the speed of opening a web page.

22110607-791cc828c8e64c18b0d86d573338a345

2. We need more functions
For me, my favorite web browser is Chrome because it provides me some extra functions and allows me to customize the interface.

One thing that is extremely attractive to me is that Chrome gives me numerous selections of plug-ins. Plug-ins make web browser not only an application to present information, but a strong tool to deal with information. For example, the famous plug-in Adblock can accurately recognize the spam information on web pages and block the annoying popup advertisements.

360%e6%88%aa%e5%9b%be-495479281

Sometimes the console based on javascript can be helpful if the web browser can not return the right information back to the third-party server for correct feedback. For example, I have the experience of failing to pay by Paypal online because the web browser can not successfully  go to the page that returns the information of finishing payment to sellers. By typing the code “window.OnPayPalSuccess()” into console, I can force the web browser to execute the right instructions. Implanting those hidden interfaces into web browsers, developers give plenty freedom to users who need more advanced functions.

360%e6%88%aa%e5%9b%be-496210375

In fact, conciseness and variety are not contradictory. Developers can cleverly hide those advanced functions  and leave tutorials for those users who need them and just make the main functions visible and easy to understand.

On the Internet – we can and can’t decide our online actions

1.What does Internet mean?
Both Wikipedia and How Computers work call Internet a system that connect one terminal, such as a personal computer or a ATM machine, to others. Of course, that description is absolutely right. Internet itself is a system, which means it is a collection of different technologies, including the gadgets we can see every day like router, from hardware perspective, and things like IPV4 and IPV6 protocol that we are rather not familiar with, from software perspective.

A basic fact is that like other complicated systems, Internet consists of numerous subsystems that can be divided into more smaller systems, meaning Internet is black-boxed. A basic model indicates that the whole Internet system is based on the connectivity between different terminals. Although I know little about computer network, I see that the core task for network software engineers is to ensure that the current Internet protocol or algorithm is efficient enough to avoid block. For hardware engineers, connectivity means optimizing the framework of hardware, including modem, router and network card and find out new materials for more bandwidth with more information transmitted at the same.

5f82075054641560f5e23061991da452_thumb

A basic model for information transmitted by Internet

So now we can see that the whole Internet system is for connectivity, without which the infrastructure and the elaborately designed protocol will be meaningless. Hal Abelson gives a more detailed definition of Internet, indicating that Internet is such a system that is about “a delivery for bits” and “how they get one place to another”. The definition is very similar to the description made by Shannon of the transmission process of information that exactly we do not care about what the information transmitted is about but the transmission mechanism. In this perspective, what we post online or what we leave when using search engine for Google or Microsoft to analyze is not the part of the system itself, so we are not implanted “in” the Internet but live “on” the system.

2.Being on the Internet is conscious
It is not difficult for us to understand that being on the Internet is a conscious and initiative process. We can post photos on Instagram to public but can also open Instagram only to friends, which means that we can control the extent to which we engage in the Internet. Actually, we easily active we should be online, after all we are the one who know the pass word of our own phones, computers and social media accounts.

To most people in modern society, they know clearly the differences of the same thing described offline and online. For example, when a friend comes to me for suggestions of buying a new computer, I will tell him that hardware online can sometimes be cheaper and less possible to be fake. That is a subjective cognition because to me the disadvantages of buying online, such as assembly, do not outweigh the advantages. Therefore, being online is an initiative choice for people because some of them are social stars who think online social platform can be more influential and some of them are otakus who do not step out of home with the convenient services provided online.

3.Being on the Internet is unwitting
Sometimes being on the Internet is an unwitting process. A number of this week’s readings mention the role that IP address and domain name play in the whole Internet system. In modern society, living like a hermit physically is not difficult, but eradicating all digital information about ourselves is an impossible task because our information has been stored in governmental database and any place we have ever consumed, lived and even just visited.In fact, modern life destines that anyone who wants to live in a developed country normally can not resist the usage of Internet and during the process our information has been known to some people we do not realize. For example, in China when I make an overseas transaction, usually I will immediately receive the phone call from bank to ensure that the transaction was made by myself. The leaking process not realized by Internet users can sometimes be used by people for ulterior purpose.

r00220020530hin01_03

The mechanism of online man-hunting

Actually, there are many criticisms about the status of modern people that they are forced to be online. Cyberpunk novels, movies and games are always focusing on the threat from access to Internet. They claim that the ubiquitous monitors and digital personal information system leave hackers tons of backdoors to invade. For example, in the video game Watch_Dogs, players can use the mobile phone to access citizen’s information, paralyze traffic system and control street cameras because all those things have been integrated into a main system called CTOS.

watch-dogs-3

Watch_Dogs is a game about hacking anything with information stored online

In general, we both choose and are forced to be on the Internet. Internet is a technical system when it was invented, but now it has been become the synonym for modern lifestyle.

Digitization – change people and media

Digitization is a perfect summary of what traditional media will become in modern information age with the development of powerful CPU and GPU, high-resolution screen and more user-friendly interface. Just as Alan Kay suggests, a digitized medium can be a metamedium with the ability to re-explain and reproduce itself.

1. Why do people need digitization?
I’m sure that more and more people choose to read words on screen not because of curiosity. Instead, digitized media attract people since their properties decide that people can learn information easily. Here are some properties of digitization media that make us feel comfortable:

    • Coherent: No matter the simple combination or re-explanation, digitization essentially is a physical process. The most complex algorithm designed for digitization should be executed by silicon-based chips and what it needs to do is to restore the original content on screen. We are still using English words and grammar when beginning to use digital equipment. The picture will not change to another one when it is posted online. Thus, I can not find many reasons for people who can not accept digitization.
  • Informative: It is controversial. Some people claim that digitized media cram too much noise information, or trash information into us. It is true. Digitization means information can be transmitted with lower cost and higher speed, thus inevitably producing useless information. However, digitization also makes our media more informative by presenting us with more dimensions of information. I watched American President Election last night, and digitized map let me know conveniently about the situation of every county.
  • Visualized: Digitization means the possibility of visualized and interactive user interface, which can help realize the “better democracy” mentioned by Manovich. Books for children always contain more pictures than words and experienced presenters will never force audiences to read long paragraphs. No matter children or adults, images are always more understandable than words. Graphical programming is an application of this idea. Digitized interface allows people to build logic frame by dragging and combing modular logic parts together.

360截图-24515125

Blockly – visualized programming interface by Google

2. What does digitization mean to media?
Digitization technology lower the threshold for creating new artistic works. In past, people relied on real tools to create music, movies and other artistic works. For example, classical musicians can hardly creating a perfect piece of music without testing with piano or violin. However, digitized tools like Adobe Audition or FL studio allow creators to view details of every track, test the performance with computer-generated audio signal and easily mix audio effects that imitate real instruments together. For a modern music creator, s/he even does not really know how to play an instrument. Admittedly, traditional music played by large-scale orchestra still represent the highest achievement of human beings in music field, but we need to pay attention to the fact that new genre of music like electronic music has ruled American popular music market. On Youtube, famous electronic producers like Alan Walker and TheFatRat has earned over one hundred million hits. Composition is not the game for minority anymore, but a skill like programming or edit graphics that can be taught through online videos.

phir-mohabbat-8211-remix-8211-dj-lijo-8211-fl-studio-remake

es2-a

Comparison between traditional stave with digital music editing software

Moreover, digitization technology make hybrid media, not only the mechanical combination of traditional media forms but re-explanation of traditional media, possible. Just think about the starting age for movies, the age of silent film. To make voice, early movies even need dubbers to speak directly to audiences. Undoubtedly, such a kind of mechanical combination can distract audiences from movie itself. Modern Hollywood movies of course have solved the problem of voice. What’s more, modern movies use special effects, 3D technology and visual reality technology to give audiences totally different experiences. Another form of media I want to mention is video game. People criticize video game as meaningless thing that is only for amusement several years ago, but few of them will say so once they know what modern video games are like. Modern video games integrate game, movie, novel and music, creating a new form of media that overturns old recognition of media. An obvious effect is that the boundary between different media has become less clear. Video Games such as Heavy Rain, Beyond: Two Souls and Until Dawn only require players to press certain key in turn point of plot to make choice, and what you need to do except for this is to sit in sofa and watch the whole story. It is really hard to tell whether they are games or not. Some people comp up with a term “interactive movie” to call those games, and I guess maybe one day it will become an independent form of media.

Software – evolve with hardware and human beings

From the first computer ENIAC born in 1946 to 21st century’s personal laptop, scientists and engineers spend decades changing those gigantic machines into small boxes that most people can afford. When we talk about development of computers, we will refer to Moore’s Law, mention the evolution from vacuum tube to integrated circuit and concentrate on cutting-edge algorithms. However, few of us pay enough attention to software. People are accustomed to taking the development of software as granted. This week’s readings lead us to consider the significance of software as media and effect on human beings’ cognition.

1. Hardware and software
It is incontrovertible that software, at least software born before 2016, is based on hardware. For example, without VR headset and powerful graphics card we can not enjoy the pleasure of VR technology. Software is artificial, so we need something that is artificial too as carrier, which is hardware now.

We have to admit that hardware development inspires people to think about software with better performance and more elaborated GUI. Of course I don’t mean that only the development of hardware can stimulate developers’ imagination. On contrary, developers always have tons of new ideas. I can see players complaining everyday about similar things like why Grand Theft Auto V leaves few rooms for characters to enter or why the graphics of World of Warcraft can not be as real as Games of Thornes or The Lord of Rings. Actually, developers can do so. They can be crazy enough to create interactive CG or seamless map that is the same big as the whole America. However, the problem is that whether we have powerful hardware or not to execute the instructions. For developers, existing workstations may consume ten years or more for them to achieve this goal; For players, such a game with unprecedented scale and graphics may require them to purchase equipment worth more than one hundred thousand dollars. The development of hardware just means lower price, thus allowing developers’ effort to be profitable. To some extent, Moore’s Law not only indicates how fast the performance of hardware improve, but also predicts how software evolves.

OLYMPUS DIGITAL CAMERA

The improvement of GPU’s performance in iPhone 

Therefore, hardware just decides the ceiling of software. Also, it decides the ceiling of users’ imagination(not developers’, but maybe scientists’). It is really interesting to observe those non-players’ or light players’ reaction to AAA games. Many of them mistake games for movies because the graphics is beyond their imagination. For myself, I could hardly imagine the popularity of online shopping and social media ten years ago. In fact, the process is that hardware decides what software developers can create, software encourages users to think about the possibilities and users’ reaction in turn makes developers introspect themselves and draw experience from success or failure.

maxresdefaultGraphics evolution of Tomb Rider

2.Human beings and software
One thing that interests me most of this week’s readings is that Manovich in his book Software Takes Command mentions that software itself has become a new medium. We are interacting with computers and mobile phones everyday, but computer itself can not be a social medium without software. Actually , that is the significance of metamedium and hybrid media.

The core statement by Alan Kay about metamedium is “a wide range of already-existing and not-yet-invented media”. So what does “not-yet-invented media” mean? Manovich answers this question by making clear explanation of multi-media and hybrid media. Modern software is not the simple combination of different forms of media. For example, I will never call a slide consisting of pictures and words software because software is not only about presentation. Software should contain change or mutation, in biological language. Therefore, I will call PowerPoint software.

One thing that confuses me for a long time is the difference between program and software. Of course a simple digital calculator is software, but I guess few of us will call a console program with the same function software. An important concept of programming is called encapsulation, which means data and procedure are integrated to provide complete function. Then programs are assembled together in similar way to form software. Finally, it is users that interact with software. For modern users, graphical user interface, which should be logical and legible, is an indispensable part of software. That is why we care about the user experience of software but not programmer experience of coding. From this perspective, software is really a media concept rather than a technical or computer science concept.

360截图-407284343

Is it software or just program?

encapsulation-data-procedure-oop-320x290

concept of encapulation

However, a challenge faced by software designers is how to evaluate the learning ability of users. Alan Kay is a supporter of free software environment that allows users to build their own media, but the idea is contradicted to mature business logic that software should be stable and developers should make subtraction rather than addition. Now the problem can be solved by strictly distinguishing productive software from software for ordinary consumers, but maybe the development of software, especially the popularization of graphical programming, will change all things finally.

 

 

Programming language – the combination of rule and logic

I always hold the opinion that computer science should be part of elementary education, just as mathematics and grammar courses. It doesn’t mean that kids have to develop a complete project or design innovative algorithms after finishing programming courses, nor does it mean that modern citizens should be able to fix bugs or develop new functions for applications they use themselves. Learning programming just means learning how to think like creatures living in digital age.

1.Programming is about language and rule
No matter what languages we use, if we want to express something and let others understand, we should follow certain rules connecting words and sentences in a comprehensible way, which is called grammar or syntax. Even though we can use other ways other than languages, such as gestures, to convey information, the prerequisite of communicating successfully is still the consensus.

Programming also follows fixed rules, though the rules may update much quicker than languages. In fact, except for binary machine code, all programming rules, even the assembler language, more or less rely on natural languages, and I think that is why we call those programming rules like C, C++, Python and Java programming languages.

Just like natural languages, the basic unit of programming language is word and punctuation mark. Generally speaking, the meaning of a key word, usually English, of a programming language is similar to its original meaning in natural language, but not identical. For example, the key word “return” in C means that a program will produce a result at the end, no matter null or meaningful results. It is similar to its meaning in English but the key word is tightly related to function structure. Another example is that key words are often used to illustrate the data types used by variables. In C language, a declaration is needed before using a variable. The key word “int”, “float” and “double” just refer to different kinds of data.

Punctuation mark is a totally different story. In standard I/O functions such as printf() and scanf() or I/O macros such as getchar() and putchar(), punctuation marks may serve the same function as they do in natural language. However, punctuation marks are often used in other ways in programming languages. For example, in C “=” and “==” mean differently and they also have different meaning from natural languages’. The former one is assignment operator. The statement “x=1” does not mean that x equals to 1 but assigning 1 to the variable x, that is to say, the statement does not state a fact but make a dynamic calculation and the calculation direction is form right to left. The latter one is relational operator, which is often used to make judgment. It may be natural for us to write x=y in daily life, but when we make judgment or test in C, the right way is to use “==”.

360截图-670546484

“==” used in while looping statement for testing

2.Programming is about logic
Although in some sense programming languages are similar to natural languages, there are still some significant differences here. When I learn C, I find that looping, branching and jumping statements are things that are hardly embodied in natural languages. Programming languages use a standard and modular way to deal with the logic relationship. An interesting idea is that the logic module, including independent function, in a program can be regarded as black box system and programming languages use simple statements to link those independent modules together like glue.

360截图-665579203

while looping and if&else branching statement

In fact, the logic of programming languages is the logic of hardware, the logic of computers and the logic of Von Neumann Architecture. The binary system uses the combination of “0” and “1” to transmit information. In electronic engineering field the binary logic relationship is reflected clearly by the logic gate and in mathematics field it is called set theory. Three basic logic principles are “and”, “or” and “not”. In programming languages, it is common to use those principles to decide whether a code block should be executed.

8fb1796ad5ab605a0db350f010e27161

“and”, “or” and “not” 

What’s more complicated is that programming is not only about typing codes facing visual compiler interface, but interacting with invisible modules in computer system. When I read source code of video game, DOOM 3, which is written in C++, I find that game programmers write codes to call functions from standard library and models from 3D module software like Maya. That will be a far more difficult thing when we begin to talk about the concept like pointer or API.

3. Programming is about computational thinking
As I mentioned at first, learning programming is not related directly to project, engineering or algorithm, but teaching people how to think. Jeannette M. Win in the article Computational Thinking points out that computational thinking is not thinking like a computer, but conceptualize, abstract and solve problems. Generally, computational thinking asks everyone to think logically.

Just think about how a C program solves the question of 1+1=?. We need to first declare the data types of two variables, then use assignment operator to assign each variable with 1 and finally add up these two variables. Then what’s about more complicated program, like a calculator dealing with integer addition? We need to introduce maybe while looping statement and standard I/O functions.

So how about daily life? I think the key of computational thinking is to set mapping relationship between problems and solutions. Emergency plan is indispensable for enterprises, allowing them to make response as soon as possible. A student can respond to teachers quickly because he know how to figure out the key word of teacher’s question. Those are all good examples of computational thinking, which means thinking is ordered, logical, modular and hierarchical.


References:
[1]Peter J. Denning and Craig H. Martell. Great Principles of Computing. Cambridge, MA: The MIT Press, 2015.
[2]Jeannette Wing, “Computational Thinking.” Communications of the ACM 49, no. 3 (March 2006): 33–35.
[3]Bryant, Randal, O’Hallaron David Richard, and O’Hallaron David Richard.Computer systems: a programmer’s perspective. Vol. 281. Upper Saddle River: Prentice Hall, 2003.
[4]Waite, Mitchell, Stephen Prata, and Donald Martin. C primer plus. Sams, 1987.

Information, human brain and machine

This weeks’ readings explain the process of information spreading from the view of information theory, a more systematic way to help us understand the basic concept of information and transmission.

Shannon in his marvelous paper A Mathematical Theory of Communication introduces a simple model to illustrate the communication system: an information source, a transmitter, the channel, the receiver and the destination work together to make information spread from one side to another one.

360截图-56969578

Basic model of information theory

1.Information
First I want to check the whole system from a rather static perspective. In this system, the core concept is undoubtedly information. Floridi is his book Information: A Very Short Introduction discusses the hierarchical structure of information-related concepts. An interesting example is about the silence, which has more information than tautology described as unary bird. In reality, the most famous application may be Miranda Warning:

You have the right to remain silent. Anything you say can and will be used against you in a court of law. You have the right to talk to a lawyer and have him present while you are questioned. If you cannot afford to hire a lawyer, one will be appointed to represent you before questioning, if you wish one.

The silence of suspects in fact serves as a strong law signal and can have huge influence on attitude of judges.

Another interesting thing is the existence of noise source. A good example is the compression algorithm for images, videos and audios. As a noise source, compression algorithm adds extra information into the original one, making it looks better or worse.

2b308422edc48a435f67bae3b0a069d2_b

A bad compression algorithm makes Lena green and fuzzy

2. Transmission
Concerning the dynamic mechanism of information transmission, I’d like to say it is an amazing idea to introduce the physics term entropy to this area. So from the perspective of entropy, the process of information transmission is usually a process of reducing probability and increasing entropy, thus bringing people more information.

Shannon uses entropy to define the threshold between decipherable and indecipherable codes, as well as the boundary between reliable and unreliable channels, according The Information Paradox. After all, it is always harder to find truth hidden beneath rumors by deducing useful information from public media than experiencing personally. Just consider the formula for the average length of the optimal code: L = –∑ {Pi * log Pi}. Suppose we get one set of code by experiencing personally and two sets of code after hearing rumors, which the probabilities of two are respectively x and 1-x. Thus, the optimal code length of the former one is 0, similar to the example of unary bird and result of the latter one is positive, meaning the latter one has more information. However, the scandal of deduction and the existence of misinformation and disinformation can finally reverse the result, which means the former one can contain more information.

3.Does meaning matter?
Actually, it is not hard to understand that traditional information theory focuses on the mechanism of information transmission itself. Of course, there is no difference between speaking English and speaking some alien languages regarding the transmission itself. We just speak whatever we like to say and our audiences try their best to determine what we are talking about. The only difference is the presupposed mapping relationship in their mind. According to the basic model of transmission system given by Shannon, the process of understanding and interpreting received information does not fall within the scope of traditional information theory, which just treats the information receiver, or destination, as a black-box system.

That’s exactly the biggest problem. The classical information theory is not wrong, but limited. I can understand that in Shannon’s age, the whole recognition of Human-Computer Interaction is based on Von Neumann Architecture, a rather hardware-based theory.

John-Von-Neumann-Architecture

Von Neumann Architecture

However, when it comes to information transmission in reality, we mostly research human beings’ behaviors instead of machines’. So can human beings’ brain be regarded as Von Neumann Architecture? My answer is no because Von Neumann Architecture does not match the structure of brain, which consists of innumerable neurons and synapses. To study the behaviors of human beings, obviously we need a more complex model and that is what Neural Network scientists are doing now. Compared to Von Neumann Architecture, Neural Network involves more interactions within the whole system.

neural_net

Neural Network

Back to human beings’ behavior. This week Professor Barba gives us some good reading materials about NASA and Human-Computer Interaction revolution. In Apollo control room, people just work like Von Neumann Architecture, receiving instructions from Flight Director and executing every order. The new interaction media technology, nevertheless, changes the way we interact with computers, asking interactors to be source of meaning themselves. Actually, regarding participants in information transmission process as black-box systems without meaning is an outdated view, instead we need to open the black-box system and find out a new theory that can help improve the traditional information theory.


References:
[1]Luciano Floridi, Information: A Very Short Introduction. Oxford, UK: Oxford University Press, 2010.
[2]Peter Denning and Tim Bell, “The Information Paradox.” From American Scientist, 100, Nov-Dec. 2012.
[3]James Gleick, Excerpts from The Information: A History, a Theory, a Flood. New York, NY: Pantheon, 2011.
[4]Shannon, Claude Elwood. “A mathematical theory of communication.” ACM SIGMOBILE Mobile Computing and Communications Review 5.1 (2001): 3-55.
[5]Bodker, Susanne. “When second wave HCI meets third wave challenges.”Proceedings of the 4th Nordic conference on Human-computer interaction: changing roles. ACM, 2006.

Affordances and Constraints in game design process

In his article Affordance, Conventions and Design, Norman emphasizes the difference between perceived affordance and affordance.[1] Thus, affordance can not be understood as feedback made by system when we are using screen-based equipment and instead it should be explained as something that “provide strong clues to the operations of things”, according to DOET written by Norman[2]. In general, affordance serves as the role that leads users and consumers to think, learn, analyze and interact.

As a representative form of interactive media, video games never lack materials for us to research design principles such as affordances, constraints and conventions.[3]

1.HUD design in video games
When we talk about interactive media, it is inevitable to talk about user interface and user experience. As for video games, a player can not judge the quality of gameplay when he first starts adventure, but he can decide whether the art style is to his liking or not once he sees the title. Jesse Schell in his book The Art of Game Design explicitly explain the hierarchical mental structure of players’ cognition. Even though for designers, mechanism, story, aesthetics and technology are equally important, the first two things players notice are usually aesthetics and mechanism maybe because these two are most easily to be symbolized.[4] So the combination of aesthetics and mechanism should provide players with enough affordances.

Games, especially the role-playing game, often leave tons of information for players to learn. Obviously, game designers in modern age will not list everything on screen just as their predecessors did. Instead they just place the most important information, such as hit point, mana point and ammunition, on the screen. Actually, the important information presented on screen is called Head Up Display (HUD), which is originally used in military area, describing the parameters shown in cockpit. To keep the HUD interface as concise as possible, one strategy is integrating the information into game contents.

The ammunition design of COD: AW

In Call of Duty: Advanced Warfare, designers cleverly make the ammunition information one part of the guns (the number will move as you move the gun and change view), giving players clear information that it is something related to weapons.

However, this strategy does not make game mechanism clear all the time. Metro 2033 uses the watch to indicate the duration of gas mask. It is really a good idea if players have been familiar with the game mechanism, but the vague and indirect relationship between mask and watch can frustrate new players at first. In contrast, Call of Duty: Black Ops uses the cracks on mask to warn players, which is a more intuitive design.

437002-metro-2033-windows-screenshot-my-gasmask-filter-is-about-to

The watch design of check gas mask is somewhat confusing

2.Map and interactive elements design
It is the responsibility for game designers to tell players what they should and should not do during the gaming process. HUD serves as the instructor of player from beginning to end, but it is not enough for players to do well when they are required to make immediate response. So designers should leave hints to players.

One thing that designers are good at is using both affordance and constraint to give players instructions. In many action games, players have to manipulate their characters to climb cliffs or trees and jump over chasms. Under such circumstances, designers often mark rocks that can be climbed and restrict characters to access those areas that can not interact with players.

DOCUMENT-1-CLIMB-UP

The climbable part in Rise of the Tomb Raider is different from other parts

In Rise of the Tomb Raider, the ice that can be climbed is evidently lighter than the unclimbable part. What’s more, it is a standard design in the whole game, meaning the pattern of climbable part can be understood instinctively by players.

Another common trick used by game designers is setting margin for map with seemingly accessible perspective. I guess every player of Counter-Strike has the experience of fleeing outside the map. A more intricate way is to destroy the environment intentionally in order to force players to move to the next scene, especially in some linear cinematic games. Naughty Dog is the master of using such a strategy. In Uncharted franchise games, players must keep moving to avoid being buried by collapsed houses and cliffs, which in turn destroy the scene and stop characters from going back. This constraint ensures that players can have compact gaming process and have no problem with finding the destination.

3.Thoughts of future game design

Murray in her book Inventing the medium listed four affordances for digital artifacts: encyclopedic, spatial, procedural, and participatory.[5] Intrinsically a computer program, video game itself of course own the four affordances. For example, RTS(Real-Time Strategy) and MOBA(Multiplayer Online Battle Arena) games produce infinite possibilities for players and professional tournaments with bonus of millions of dollars. Compared to legacy media, video game is totally multisequential and interactive.

However, the complexity and flexibility of video game have brought designers a question – how to know what players really like. In traditional media age, users receive information passively, so designers only have to consider the transmission process from one direction and in digital media age, especially during the process of designing HCL system, designers should select the appropriate conventions that human interactors can understand, according to Murray.[5] Modern video game design is based on the mature media like movies and novels and asks designers to consider the balance between mechanism, story, aesthetics and technology. The problem here is that players have different preferences so designers can only accumulate experience by making mistakes to set good conceptual models for most players. A typical example is the failure of No Man’s Sky, whose developers are seduced by new technologies. [5] They create an universe by automatic random algorithm but neglect the importance of level design, thus making the world vapid, sterile and repetitive.

In general, game design is a formidable process and requires developers to correctly construct conceptual model for most players and make clear affordances, constraints and conventions.


References:
[1]Norman, Donald A. “Affordance, conventions, and design.”interactions 6.3 (1999): 38-43.
[2]Norman, Donald A. The design of everyday things: Revised and expanded edition. Basic books, 2013.
[3]Norman,Donald A, “Affordance, Conventions, and Design.” Interactions 6, no. 3 (May 1999): 38-43.
[4]Schell, Jesse. The Art of Game Design: A Book of Lenses. 2nd edition. Natick: A K Peters/CRC Press, 2014. Print
[5]Murray, Janet H. Inventing the medium: principles of interaction design as a cultural practice. Mit Press, 2011.
[6]Stonehouse, Anthony. “User interface design in video games.” Gamasutra. 27 Feb 2014.
[7]Zhang, Jiajie, and Vimla L. Patel. “Distributed cognition, representation, and affordance.” Pragmatics & Cognition 14.2 (2006): 333-341.

 

 

 

My thoughts of mediation – from perspective of UX design

The final goal of a product designer is to provide users with the best user experience. User experience(UX) is a complex concept since its definition just varies from industry to industry. Lidwell, Holden and Butler discuss some basic rules of design in Universal Principles of Design, the reading material at the beginning of this term. Of course, designers from different industries will focus on different principles. But one thing which is undeniable is that UX design requires designers to learn deeply of users’ preferences, mentalities and subconsciousness.

Obviously , it is ridiculous to separate technologies from society and culture. In fact, daily products, especially computer software and mobile applications, can be regarded as structurally hierarchical. The bottom layer, of course, is the coding layer, supporting the realization of function by intricate logic computation and the top layer is user interface(UI), which interacts with the users directly. So, according to the definition of technical artefacts given by Philosophy of Technology: From Technical Artefacts to Sociotechnical Systems, we must discuss user plan and practical function together when we are trying to learn the essence of a design case. It just means that people who involve in the system construction process, not only designers but also users and participants of a hybrid system such as a civil aviation system, matter as well. Here I find out two interesting examples of people’s cognition influencing the effect of information transmission.

The first one is about the same book with two different versions of cover:

24083af0615f479e1797e7abcf5a432a_b e3f1c15dd68dac3bd130c73786bb6bf9_b

The same book of two versions with different covers

In this case, the Chinese version has a hook-like symbol in the middle of the cover, instead the English version uses a X-like symbol. These two symbols, however, just express the same meaning of confirmation. In different cultural backgrounds, people often use diverse, even opposite, gesture or symbol languages to express the same meaning in the same circumstance. The most famous example should be traffic rules in most Commonwealth countries, where people drive on the right side. To be honest, localization should be a common sense to every designer.

The second one is about slides presented by a Baidu designer on a professional conference:

34353e65ec7ba0481b6c243245e37c69_r

c56d8fbc0be1c9523f680fc33f9195d7_r

Slides used by two presenters in the same conference(upper: Microsoft, lower: Baidu)

I do not want to talk much about the color of the slides(in fact it reminds me of the blue screens when Windows breaks down). The problem here is whether it is a good idea to put selfies of girls on slides to illustrate his idea in such an occasion. Do professional designers from different countries need to understand the tendency of design development in such a way? Maybe young students with high level of hormone can be more easily attracted by the slides and interestingly, this designer indeed used the slides during the process of campus recruitment. If the audiences in the conference are deemed to be the users of the inappropriate presentation, I guess their user experience will not be good.

So Leaving users and participants, design and technology will be meaningless.

Now let’s dig deeper into the social-technical system. Latour in his book Pandora’s Hope: Essays on the Reality of Science Studies shows us four meanings of technical mediation. I think we can use a term called information flow to explain and understand technical mediation. Latour describes the mental change of people facing a man holding a gun and asserts that a man with a gun can create a totally different effects from which the two objects separately can bring about. Lu Xun, the famous Chinese writer, criticized some conservatives by stating that “Chinese can be imaginative while seeing short sleeves because they will link the sleeves with white arms, then naked torsos and finally sex.” In fact, human beings are always good at associating an object with a new one. Here is a screenshot of Steam store:

360截图-309972656

the information of a discounted game in Steam store

Players will not realize how much they can save when they just see -70% and how great the discount is when they only view the price change. However, these two things together can leave users an impression that they now have a perfect opportunity to purchase the game. What’s more, the due date on the left side with a countdown clock reminds players that the chance is fading away. Actually, it is extremely effective for those players who are hesitating. Latour also mentions a meaning called composition by making an example of chimpanzee. Actually, the searching system used by every shopping website is a good example here. For instance, the one who wants to purchase a laptop on Amazon can search the ideal product by input color, weight, brand, resolution of screen and many other parameters into the searching system and check the limited results. In this process, the need has been divided into some subprograms, just like Latour says in his book. The last meaning made by Letour just reminds me of last week’s readings, which explain the connotation of symbolic cognition. The process from human to nonhuman describes the formation of symbolic language. For example, in the interface of Visual Studio, I will naturally regard key words like while, for and else as representations of the logic relationships intead of using their primary meanings in English.


References:
[1]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.
[2]Latour, Bruno. Pandora’s Hope: Essays on the Reality of Science Studies. Cambridge, Mass: Harvard University Press, 1999.
[3]Regis Debray, What is Mediology?. Le Monde Diplomatique, Aug., 1999. Trans. Martin Irvine.
[4]Terrence W. Deacon, The Symbolic Species: The Co-evolution of Language and the Brain. New York, NY: W. W. Norton & Company, 1998
[5]Lidwell, William, Kritina Holden, and Jill Butler. Universal Principles of Design. Revised. Beverly, MA: Rockport Publishers, 2010.