Design for the Digital Realm

As digital technology industries take the lead in dictating ways of doing and thinking, design and its process is not immune to this paradigm shift. Designers’ role in the society today, is not only enclosing content but it is also shaping things, extracting information from abstract databases, writing user scenarios, engineering systems and inventing. This course is aiming at training students to research, analyze, prototype, and develop design concepts for digital media for three distinct social, and cultural contexts.

Research driven design, authorship and entrepreneurship through design appear to be the emerging practices with widely use of digital technologies and enable design as a self sustaining profession. Throughout the semester students will be encouraged and guided to concepts and workflows that will result in digital artifacts that are research, data and interaction driven.

Semester will be divided into 3-4 week long, three different projects in order of shrinking scales. Starting from the gallery scale to browser and then to mobile application or even to intangible, invisible services through digital communication and interaction. Throughout the course, history of design will be revisited to see how client driven design practice has partly evolved into a research driven authorship or entrepreneurial practices.

The main references for the first project will mostly be from the avant-garde artists who made use of interaction design and its technologies online and in space.

The second project on publication design will deal with concept development for subcultures and history of publication before and after digital production and distribution.

Third project on function (use) design is about entrepreneurial, social, cultural or phenomenological artifacts that reflect business, artistic expression, apps and more that are reflective of the multitude of roles that designers fulfill in order to meet the needs of today’s complex social and commercial world. The core of this assignment is to study three crucial skillets: narrative, structure, and flow. Students will develop projects with increasing complexity, leveraging design precedents, user insights, information architecture, and UI/UX design.

“UI/UX Designer” has been one of the mostly encountered and popular job posts of the recent years. This good looking abbreviation stands for “user interface and user experience designer”. Interaction and experience are aligned with screen ergonomics and usability. Although usability and screen ergonomics are mature subjects which were being studied way before the digital communication pervasion but they were more in the realm of engineering and industrial design. Today, these are two important matters in the ever-changing activity list of today’s designers.

User Experience Design is a broad term used to explain all aspects of a person’s experience with a service or product including its interface, graphics, industrial design, physical interaction, and the manual. As one of the most important elements of user experience, user interaction and its design, in the last few years, shifted from being just about specifying UI components and communicating them to the engineers. Interaction designers have more freedom to design contextual interfaces.

From one point of view user experience is a tautology as the design of any service or product inevitably creates the interaction scenario between the human and the artifact. From another point of view the effort for designing the user experience will end up with taking the full control of the user perception over a service or product which is impossible because of very simple fact: each person is another person. Projects in this course will try to evoke some ideas to find a comfortable and productive place for a designer in between these two artificial approaches.

Throughout our research we will need to discover and learn more about some related concepts. Basic principles of semiology will be our main guide as we embark on discussing relatively complex concepts such as Skeuomorph.

So, in the context of this course, we argue that to master UI/UX design, practice is a must. This course will consist of three design projects all of which require fine experience design and its presentation.

Design processes will require some exercise on some tough and complex technical challenges such as information architecture, interaction design, and digital typography. Throughout the course, apart from the lectures students should read more to learn about new business processes and new technologies. The course blog will provide some good links to interesting reading. Additionally, design processes will employ the study of user behaviours, usability tests and interviews, prototype testings. In the course of lectures some useful methodologies will be introduced and suggested but more interesting results are expected from the students. For each project there is a particular proportion for the working prototype over a mock up.

Earlier two projects are more subject specific than the final one. Students will be asked to choose one among alternatives and develop the design concept for that specific subject matter. The subject and the scope of the final project is considered as a part of the design process and will be decided by the student. All three projects will follow the same UI/UX design processes. Strategy, scope, structure, skeleton and surface design. Concept development phases of the projects will also be different due to the different subject matters and also unique project description scenarios.

A typical digital artifact design process for each project will employ following steps:

Concept Development
Information Architecture
Interaction Design
Sketching
Surface a.k.a Visual Design
Typography and UI elements
Mocking up
Prototyping
Presentation
Feedback and Analysis

In addition to these projects, depending on the schedule we will do two in class exercises like sketch problems. The subjects will be announced on the day and graded as quiz.

In-class workshops will be organized when necessary. One of the important workshops will be about content management systems and self publishing in general and specifically you will learn how to use and manage websites with templates. WordPress and Kirby are two major examples to work on as we cover the information architecture of various CMS.

Coding and development skills gained over the earlier semesters of the design program at Mason Gross will play a key role at almost all stages of the project development. Processing, 2D motion and animation design, physical interaction design and prototyping will help you not only producing content for the project or prototyping it but also will be inspirational for the concept development stages of your projects with the particular subcultural communities that they are peculiar to these activities. However, among all, HTML and CSS languages will be the staple to publish all projects. There will not be major advisory on the basics of these programming languages, it is expected that students follow up with open source resources online like w3schools and learn the basics. The aim of this course is to lead the content development and helping students to follow an appropriate path to publish ideas and content as well as discussing the aesthetic matters in class collectively for each project.

Books

• Post-digital Print – The Mutation Of Publishing Since 1894 by Alessandro Ludovico
• Designing the Editorial Experience by Sue Apfelbaum and Juliette Cezzar
• The Elements of User Experience by Jesse James Garrett

These books are suggested to buy but all the related articles and readings will be provided on course blog.

Assignment Reviews
These reviews are delivered upon your presentation of the assignment on each submission date. All students in class are encouraged to participate to these reviews and discussions.

Research Projects
There are reading sets to be assigned after each lecture session and you will be responsible to write an annotation about them. During the semester you will be asked to explore similar works to the ones presented in lecture hours and post them on your blog. These writings and collections will help you a lot to put your ideas and knowledge together to write your thesis proposal.

The course blog: http://teaching.paganstudio.com/fall2017

Tools+Materials
Most of the hardware and the software which are going to be used in class will be provided and be ready in the classroom in our class hours. On the other hand we strongly recommend that you have your own computer at home equipped with relevant software for practice and execution of the assignments. Here is a list of software which we are planning to use during the semester:

• Processing
• Arduino
• Kinect
• Leap Motion
• Brackets
• P5JS
• Adobe Suite
• FTP servers etc.
• Python
• Javascript

Some of the assignments will require higher processing speed and larger memories than your own computer has so please prepare yourself to work in the lab at school throughout the semester. If you would like to attend the class with your notebook computer, of course you can but you will be responsible for your own workflow and troubleshooting.

Lateness and Absences
Three arrivals of more than 10 minutes late will count as one absence. After three unexcused absences, your fourth absence will lower your final course grade one level. If you miss class, it is your responsibility to catch up on the work by checking the blog and contacting the instructor by e-mail.

Office hours
Office hours will only be held by Atif Akin on:
Tuesday 4:30 to 5:30 pm, Wednesday 10:00 to 11:00 am
Apart from the office hours please own a separate blog for this course and share your steps and send me a link to atif.akin@rutgers.edu whenever you need an extra eye or when you have anything to ask regarding the assignments. You can also add on Skype. My screename is atifakin.

Assessment
We expect students to engage in research, sketch ideas and their offshoots, pursue multiple solutions to a given problem, and experiment widely with concept, imagery, type, materials and composition.

By the end of the term students will be asked to publish a video documentary of the work throughout the semester. This video will include screencasts, live action footage and talking heads.

Project presentations will be made on the due date of the assignment in the classroom. Students’ contribution to these open panel/critique sessions is important.
A successful student of this course should be able to:

design and develop for mobile media and gadgets.
think creatively and strategically for a given purpose to design and develop for web and create content management systems as well as a front end.
initiate and present a project for any digital medium.

Learning Outcomes

Students who attends the class and fulfill the requirements of the assignments will be able to:

observe the latest technological advancements and start and lead a digital publication project from scratch.
establish appropriate digital publication workflows for specific purposes.
gain the vision to improve their digital image publishing techniques and keep up with upcoming design technologies.

Grading

Your course grade will be calculated as follows.

10% : Coursework, attendance and blog updates
15% : Portfolio
25% : Project 1: Exhibition
25% : Project 2: Publication
25% : Project 3: Service

Grading of each project will be made in critique sessions with the participation of the students. Coursework, attendance and blog updates will be tracked and evaluated by the instructor.
For project critiques, work must be presented on the announced date, at the beginning of the scheduled review. No late work will be accepted.
You will have two make up chances during the semester. These two weeks, you may follow from the schedule, you will be given the chance to enhance two previous assignments. Please keep in mind that the make-up’s are only for solving for technical problems or optimizing your work. To get an upgrade you should keep working on your project even after the deadline and presentation.

The grading system is:
A = Outstanding performance throughout the course, work excels consistently in all the areas described above
B = Exceeding basic expectations for all projects
C = Satisfactory performance, that is, the completion of all assignments
on time and at an acceptable level
D = Poor work
F = Failure
Please note that a C grade means you have attended all classes and met satisfactorily the requirements of the course. To earn a higher grade, you must show not only more effort but also a higher level of achievement in your work.
There is no guarantee that extra effort will yield outstanding work; and yet it is extremely unlikely that without extra effort you will create interesting work or develop as a designer.

Portfolio

This is not one of the three projects but rather a life long endeavor throughout design education and practice which will be a side/background subject of the whole semester. In the first couple of weeks the concept of an online portfolio will be discussed and in production workshops will be carried out in class and the portfolio site is expected to be up and running throughout the whole semester.

The content of this web site is your own design work. This portfolio site, with its URL, concept, content delivery strategy, interaction and interface design will constitute the backbone of your designer identity. Whether you go to a graduate school or apply for jobs or just simply work as a freelancer you will need to represent your education, experience and style to other people. Curation of your own work is very important and it is also a part of the strategy, the ways that you communicate your work is the most important design question in this project.

In portfolio design, do not favor one style or technology over the other. It is all about the strategy and UX driven by this. UI follows and also it should be a bit in flux at least until you get fully busy with professional work. The strategy should be developed in accordance with your short term goals. For example home/ office idea of Feltron: http://feltron.com is an interesting strategy to get commissioned by showing his self driven work.

Throughout the semester we will also take time to look back in your body of work and curating your own portfolio. Also we will discuss various visual representation techniques to display design work in digital medium and online.

Reading:
How to Be a Graphic Designer without Losing Your Soul by Adrian Shaughnessy
PDF on (http://dkwgraphicscourses.files.wordpress.com/2012/02/how-to-be-a-graphic-designer-without- losing-your-soul.pdf)

PS: In the first couple of weeks, a 2D motion graphic workshop will be conducted in order to strengthen the abilities of the students to present interactive and non linear design work in a time based fashion.

Project I: Exhibition

The first project of this semester will be interaction and publication design in 3D space. The project will be realized in the context of the undergraduate art open exhibition in the Mason Gross Galleries. The theme of this year’s exhibition is “Between Either and Or”. Students will develop concepts and products around this theme that are digitally produced and/or distributed and eventually all presented in gallery space.

There is no restriction for the medium of expression for the final display.

Project II: Publication

It is a reading renaissance. Over the last couple of years, Amazon sold more ebooks than paper books. If it was not Amazon, it would be something else. We call it a renaissance because it is given that people who buy ebooks also bought more paper books than before. The ebook, as a technology, the biggest new invention in reading since Gutenberg cranked out a Bible with movable type which changed the world.

Leaving all social and economic aspects of this revolution to related parties, we will take this transformation as a given and try to comment on the design aspects of this phenomenon and practice this new medium. This medium is not only the digital version of the content. Various types and sizes of gadgets with different interaction capabilities enclose this content. Interaction designers, unlike the book designers of the past, tend to take the medium as a given. This approach is acceptable as we consider the highly technical challenges of designing these gadgets.

Canadian philosopher Marshall McLuhan is remembered by his famous saying ‘medium is the message’. By saying this he was referring to the semantic reference of a message to the medium that it was conveyed. A second different sense of this maxim can be read as: tools shape the experience or let’s say the content. Taking the act of reading a book as an experience, designers role shift from designing the interaction between the book and its reader, the paper and ink stains on it to designing a tool for a pleasurable reading experience.

Building better reading interfaces requires that we closely observe and rethink the way we read. While we need to find ways to navigate long texts on tablets, typography will continue to play the main role in the performance of a reading interface. Two urgent matters to investigate before embarking on the project are:

a. The humane use of digital environments, gadgets b. Paper vs. Screen reading experience

The content development process of this publication is another design question as a part of this project. You are responsible for starting a research and forming content about a subject matter of your interest. This will also be an introduction to the idea of ‘research driven design’ which is also an effort to render design as a self sustainable practice.

Reading

Here are some excerpts from the reading requirements of this assignment and some highlights. More to be found on the course blog:

Designing for iPad: Reality Check http://informationarchitects.net/blog/designing-for-ipad-reality-check/

WIRED on iPad: Just like a Paper Tiger… http://informationarchitects.net/blog/wired-on-ipad-just-like-a-paper-tiger/

Improving the Digital Reading Experience http://informationarchitects.net/blog/Improving-the-Digital-Reading-Experience/

iPad Scroll or Card http://informationarchitects.net/blog/ipad-scroll-or-card/

Horizontalism and Readability, Frank Chimero http://www.thinkingforaliving.org/archives/5469

From Metaphor to Maturity http://spiekermann.com/en/from-metaphor-to-maturity/

Umberto Eco’s Antilibrary – Brain Pickings https://www.brainpickings.org/2015/03/24/umberto-eco-antilibrary/

How to Read a Book

How to Read a Book: The Ultimate Guide by Mortimer Adler

Task:

To be able to design a better reading experience at the most basic level, we have to understand how to bring digital reading into a form of continuity. And to get there we need to find out what makes and breaks continuity.

A digital text, on the other hand, has completely different strengths and weaknesses:

• It’s easy to find a particular sentence
• It can tell you how much time you spent with it, and how much time is left
• It’s hard to remember text location, but easy to work with text, e.g. sharing text highlights and taking notes
• It can adapt to your personal needs and taste
• While the printed text has been refined over centuries, the digital text is still young.

This second task is to design and implement a responsive, cross platform publication. The content creation is to be discussed in class. Please try to think in advance ways of which you can gather digital content. You will be asked to focus and research on a subculture or community and use digital communication techniques also to generate content for this publication project. Hopefully, this will also encourage you to think and be creative about the social implications and consequences of digital culture and network and how it effects content.

PS: Please take a look at the Seinfeld episode in which Kramer is developing concept and designing a coffee table book about coffee tables in the form of a coffee table:

https://youtu.be/3QjTPA-Ib9E

Project III: Service

Inventions of the industrial age were some kind of goods. Let’s say one of the most iconic one among these is the light bulb. It was valued as an industrial product with its use value to produce light out of electricity, not as a tool sell electricity or not as a symbol for social status. As the digital technology industries take the lead, digitalization of communication, production and consumption created a paradigm shift for what was called as invention. This paradigm shift can be analyzed from various perspectives but within the context of this project we will argue that the inventional products of the digital industry age are more in the forms of services rather than being in the form of physical products. Of course it may also be argued that these services are empowered by gadgets or the gizmos, technological physical products in various forms but apparently services have the larger share in the total value of these services.

Archimedes’ experience at the moment of the invention of his hydrostatic principles is a proof of that, new ideas can arise when the conscious mind turns away from the subject or problem, when the inventor’s focus is on something else, or while relaxing or sleeping. In fact this is partly valid for a designer, the valid part is the existence of a problem. Than the rest is up to your problem solving manners.

This project will be a second chapter in the idea of ‘research driven design’ in which the research process will help you to develop the concept and define the context and the present the idea.

Reading

Leverage Points, Places to Intervene in a System by Donella Meadows – http://donellameadows.org/archives/leverage-points-places-to-intervene-in-a-system/

Task

For this final, project you are asked to solve a self defined problem by designing a service inspired by all techniques and discussions covered over the last two semesters.