Topic A
What Are New Environments?
The term “new environments” quite broadly refers to many kinds of digital environments that allow people to interact with people or things, through a device like a mobile phone or a desktop computer, and often through the internet. They are environments in the sense that people are able to have an experience inside, or in interacting with them. A new environment may be an immersive 3D world like Second Life, or it may be something as simple as a pizza ordering service via an SMS gateway. It may be a corporate blog used for announcing progress on products in the pipeline, or it may be a movie reviewing application delivered through a social network like Facebook. In this course, we are going to focus specifically on new environments that are accessed through a web browser.
The web as a platform
We have moved into an era where the web is becoming a platform for people to do things, store things, and share things. We have moved past the web’s original premise of using websites simply as store catalogues, asking users to passively browse the static pages. The web is dynamic. It can allow us to manipulate information quickly, combine it easily with other information like maps or search engines. Things can be shared, commented on, contributed by other people.
New opportunities
There are new opportunities and challenges for the designers of these new environments. These designers don’t work alone. These designers must collaborate with:
- Programmers that develop the systems that power these environments
- Information architects who organize, categorise and structure the information inside these new environments
- Clients whose businesses drive and rely on the design of these systems
- The users of these environments
…
Topic B
What is user experience?
This week we will be looking at the term “user experience.” This term has evolved to become a new field of design that bridges many disciplines, such as interaction design, web design, service design, communication design and architecture. The term is used to refer to the experiences that users, or customers of products and services have. It is used to place emphasis on the experience of users as the outcome of the design process, rather than simply the technological outcomes that are produced.
Why is UX important?
For the information technology industry, the shift in emphasis from the technology that is developed to the experiences of people who use that technology has huge implications for the way that we develop software systems, or new environments. UX requires professionals from different domains to collaborate with each other in order to reach successful UX outcomes.
How do we understand UX?
In order to design new environments with the experiences of users in mind, we must first understand what the experience of using new environments is like. We must be able to use and experience a range of different environments, and get to know how they are similar and different. What kinds of experiences excite us or delight us? What frustrates us? And why? Is it that the sign up process is too long? Does it make us feel empowered? Or does it make us feel blamed when an error occurs?
Recent trends in UX
In recent years we’ve seen an explosion of new environments that offer new ways of connecting with each other, and new ways of interacting with information. One of the biggest trends has come from the rise of mobile devices. Devices like the iPhone and Blackberry have become more than just mobile phones, but they have become mobile computers that allow us to access the web with a web browser as though they were any other computer. But the unique thing about mobile devices is that they are mobile. And now equipped with things like cameras and GPS chips, mobile devices can start to deliver experiences with new environments that are designed to capitalize on people’s mobility.
An example
The iPhone, for example, allows people to download small “apps” that do very specific little tasks. One app, called “Nearest Tube” (http://www.acrossair.com/apps_nearesttube.htm) makes use of the iPhone’s GPS and compass chip, together with it’s on-board camera, to show an augmented view of London’s surroundings. Hold your phone up in the air, and it overlays an interface of your surroundings with information pointing to the nearest tube stations. This is very location-specific information, delivered in a way that is immediately connected to your surroundings. The experience of using the application is quite magical.
Touch screens
Whilst touch screens have been around for quite a few years, recent technology allowing for more fluid and gestrural “multitouch” interfaces has become popular since the introduction of the iPhone. Multi-touch technology allows us to think past the mouse, or the single-pointer as a way of interacting with information. It can allow for different kinds of interaction that make use of gestures like swipes, or pinches. It can allow us to make experiences with things that connect the hand directly to an object in an environment, and bring a new sense of materiality to the interactions.
Another example
The Eureka tower in Melbourne has installed a multi-touch information kiosk that allows people to explore Melbourne’s history and cultural heritage in a fluid and moody environment. http://www.gesturetek.com/illuminate/businesscases/eureka.php
It’s work checking out if you’re a Melbourne resident.
Service Design
A major trend, or meta-trend that has emerged out of UX is the field of “service design.” The way that we interact with businesses is no longer through one medium only. Many organizations offer products and services through different media channels. Service design responds to the need for organizations to design and organize how people will experience these products and services. The different instances where a customer may experience an organisation are called “touchpoints.” Banks are a good example of where service design is needed. The way in which customers may experience face-to-face service with a bank may well be very different to the experience of using that bank’s internet banking for example. Service design aims to help organizations work with these multiple touchpoints to understand and design more holistically the experience that a person will have of that organisation through these different touchpoints.
Although we will not be going into service design in this course, it is important to understand that user experience is a growing area that is trying to bring professionals together to work on products and services in a holistic way.
…
Topic C & Topic D
Topic C: Communication Design For New Environments
This week we will explore what design for new environments may mean for communication/graphic designers. Last week we looked at user experience design (UX), and how a focus on the experience of users has lead to an industry which requires collaboration from different professions in order to design and build new environments. Next week we will build on this further by looking at the technology of new environments, and how this can shape the way in which communication designers can be expected to engage in the design process.
Visual appearances
Quite often when communication designers are employed to new environment design projects, they are assigned primarily to handling the visual appearances of these environments. This can quite often mean that communication designers are not engaged until the end of the process to make products more stylish, or more “visually appealing.” There is a problem with this assumption, and with this way of equating communication design or graphic design solely with visual design. And that is the strategic and conceptual underpinnings of any communication design or graphic design practice.
Designing for communication… for experience
What communication designers bring to a new environment is not just a new look to make a product more appealing, but a visual language, underpinned by a concept and a strategt, designed to communicate with the user and help to support the aims of the user experience. In other words, it is quite simplistic to attribute our kind of work to making things look pretty. The work that we do in giving an environment a form, or a language, is that it informs and directly affects the experience that a person will have with that environment.
It is therefore important for communication designers to be engaged at a strategic level in the design process of a new environment. This means contributing to the creation of a brief of the user experience goals. Of the kinds of experiences that the new environment should be designed to support. Immediate visual appeal, or attractiveness of some kind might be one of these goals. As an environment, this visual appeal may the the thing that will hook a person into paying attention to using the environment.
Beyond just visual qualities
Experience design requires us to look past just the visual qualities of a product, and think about the experiential qualities. We have already been thinking about the qualities of experiences when it comes to new environments. Think about your learning activity from last week. The work of a communication designer should be to help design a new environment to support certain experiential qualities.
This concept of experiential qualities of new environments is explored in the reading set for you this week. It is written by Jönas Lowgren and Erik Stolterman, and it describes how we must think about the aesthetics of new environments (which they label “digital artifacts”) should be considered as how they feel to experience, rather than how they are simply to look at. This kind of theory comes from interaction design, but applies directly to what we are doing here, which is learning about how to design new environments with experience in mind.
Experiential qualities
Experiential qualities are made up of a mix of visual, temporal, emotional aspects of using a new environment. It is about what something feels like to use.
For example if we were to evaluate a new environment purely in terms of its immediate visual appearance, we may say that it is exciting to look at upon first impressions. But who knows what that thing is like to use. It may look good, but say we enter some information, press a button, and get taken to a screen where we become confused, and must return back to the first, without any explanation of what has just happened. What was at first an exciting visual experience has now turned into a confusing, alienating and frustrating experience of use.
When we design how a new environment will look, we must consider it not as a static object, but a dynamic sequence of events. How does the experience feel over time? How does the experience help to guide people through a process?
Communication
The role of the communication designer is to design and manage the way in which communication facilitates this experience. You can make a product as shiny as you want, but does it communicate what it does? People may come to your environment in droves, but will leave the moment they are confused. How clearly does your environment communicate to people, and how does this affect the user experience?
Traditional communication design principles
For communication design within these new environments, there are many familiar principles. Grids help to bring consistency and modularity to the screen. Clean, readable typography enables easy reading. Colours and symbols allow for a visual language to form, and allows people to read your environment in short hand.
But there are, as we are already learning about, aspects to new environments that are different to say print media. Time and dynamism, the changing of the environment over time, or in response to a user’s actions, mean that we no longer design static pages like a printed catalogue. It requires us to design for change. To create templates that provide order and consistency, also known as the graphical user interface, of our application.
…
Topic D: The technology of new environments
Whilst we have been focusing on designing to support user experience, it is also important to consider the technology that makes new environments possible. We will be focusing this week on the technology of the web, specifically web browsers, content management systems (CMS), and web programming languages, and how these all affect the way in which we design and build new environments, and the kinds of collaborations with other professionals that are required to do this.
Web browsers
Most of the new environments that we use on the web are accessed through a web browser. Many of us will have used a web browser, even if we aren’t aware of it, as this video from Google research shows: http://www.uiandus.com/2009/06/18/news/what-is-a-browser-etc/
A web browser is a program that allows people to display, and interact with web pages, or web sites. The browser is run on a user’s device (a Desktop PC, or a mobile phone, or a Notebook computer). Common examples of web browsers include Microsoft Internet Explorer on Windows computers, or Firefox on both Windows and Mac, or Safari, which began on Mac, but has now moved to Windows as well.
XHTML, the language of web pages
Web pages are written in a language called XHTML, or “extensible hypertext markup language.” This language consists of “tags” that describe the content and structure of each web page. Along with this XHTML code, a stylesheet, or cascading style sheet (CSS) is most often provided to tell the web browser how this content should be displayed on the screen. The CSS file defines the colours, fonts, and images that are used to stylistically render the page. It works by providing the web browser with “rules” that apply to common sets of tags, which tell the web browser how to apply style to common elements.
When a person types a web address (URL) into a web browser, a request is made to a server which corresponds to that web address. The server then processes that request. A request can be for a specific file on that server, or it may be a more complex request. If the web server were a blog, for example, we may click a link called “shoes.” This will send the web browser to the URL: http://blog.com/tag?=shoes, asking the server to “get me all the posts in your blog tagged with ‘shoes’.” The web server will look through its database of blog posts and get all of the posts tagged with shoes, build them into an XHTML page, and send it back to your web browser. Once it gets to your web browser, also called the “client,” the XHTML page is processed and displayed on screen according to the accompanying CSS file.
Client/Server
This is the basic premise of browsing the web. Servers store content in databases, and process requests from clients, retrieving information, putting it in the right format, and sending it back to the client, which then interprets it and displays it according to its own stylistic rules, or according to the style sheet that accompanies that page. Rather than building static web pages, it is more common nowadays to find web sites being managed by content management systems, or specific software that runs on the server and allows people to publish and store content in a database and serve it up to people’s browsers according to what they request.
Content Management Systems
The blackboard system that we have been conducting this course within is an example of a content management system (CMS). So are the blogs that you have all been using. Most websites use a content management system of some kind.
For the designer of how a new environment will look, rather than designing how each page individually will look, a CMS will use a template that tells it how and where to insert content into an XHTML page. The designer also creates the accompanying CSS code that tells the web browser how to display the page. Whilst we will not be going into detail with learning XHTML and CSS, and how to construct web pages, it is important to understand that in the current climate where content management systems form the basis of almost every new environment, each page will not be built separately by a designer, but rather, programmed into a template, which the CMS uses to format and structure the content which it returns to the web browser.
Templating
You may have already come across this notion of templating, or skinning, via your blogs. Blogs can be customized, or reskinned through the application of different templates, or themes, as they are commonly called. This can change simply the typography, layout and colours of your blog, but it can also affest the ordering, structure, and behavior of the blog. Templating is the interface between the design, and the programming that goes on behind a website or new environment.
In this course, we will not be teaching the practical skills for building web pages, rather, we would like you to come away with an awareness of the kinds of technologies involved, and of the professionals who would be involved in the process of building or customizing content management systems.
It is common for many people to hire communication designers or graphic designers to simply develop templates, or skins for existing content management systems. Quite often, this kind of approach can restrict the designer to shaping only the surface appearance of a new environment, rather than an engagement with the user experience outcomes of the design process. We would like to be preparing you to be a designer who focuses on the user experience, rather than just the application of a skin or template.
Engaging with professionals
As designers and strategists, you will be required to work with technologies, and with the people responsible for the nuts and bolts development of certain functionality in the new environment.
Web servers use a variety of different programming languages to process requests, and perform the tasks within content management systems. Popular languages at the moment are PHP, .NET, ColdFusion, Ruby on Rails, and Python. Each of these languages has different advantages and disadvantages, and suit different kinds of situations. PHP is a very common language for many CMS, and is the language used to build the WordPress blogging engine many of you are using for blogs. Web programmers, or web developers develop and customize the code needed to build CMS and web applications.
Quite often, web programmers will also work with web designers to develop templates and style rules for the display of new environments. As communication designers working in this space, it is very important to engage with web programmers on projects developing new environments, and you will be required to co-design and develop new environments with such professionals.
