Exploring Practice by Roberta Lor

2018 - 2019 CENTRAL SAINT MARTINS GRAPHIC COMMUNICATION DESIGN

UNIT 7 EXPLORING PRACTICE 2

PART ONE: Circle, Square and Triangle Experiments in translating shape and form

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

ABOUT MY PROJECT PROJECT OVERVIEW STATEMENT

The Circle Book

The Triangle Book

Above: This image shows the mock up of my circle and triangle publications.

I designed my process book with the aim of showing my learning process, project development and individual viewpoint. In the Information and System platform, the overall design problem is to explore and experiment in translating forms and shapes with supporting research. In this unit, we tried to find out an appropriate medium and design solution for a circle, square and triangle publications.

Throughout my project, I considered the fundamental visual elements of graphic communication design. I experimented with different possibilities, iterated with both conventional and digital fabrication methods. I am still learning how to express and present my ideas in an understandable way. Besides, discovering new perspective is the theme of my works, I was thinking about our vision, reading experience and how we feel the space.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

THE CIRCLE BOOK THE CONCEPT OF A CIRCLE

Above: This image shows the circle publication. Left: This is a mindmap that show my thinking process. Bottom, Right: These are the definitions of the circle.

In the Information and System unit, we looked into the basic form of shapes, including circle, square and triangles. After studying the meaning of circle, I found circle symbolizes perfection. The circle can represent endless, complete, connected and unbroken. I had come up with a series of definitions and created three 360 degree publications, which demonstrated my finding and representation of a circle. From my perspective, the circle is spacious, infinity and undefined. It is mysterious, many mathematicians study about the circle, like the number of Pi. I experimented with the endless idea. I tried toshow the views of 360 degree with coptic stitch binding, turned the publication around with turntable and demonstrated the idea of space. I tested with different materials, from analogue to digital methods, such as paper cutting, digital printing and digital fabrication. UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

RESEARCH & ANALYSIS READING MATERIALS | WORKSHOPS | VISUAL REFERENCE

Above: This is a documentation of the circle workshop and group activities. Right: The British coins design by Matthew Dent in 2008.

In the preparation for the first lesson, I prepared an Iceland coin design. I found Iceland coins are beautiful. Each coin has a different sea creature. From my perspective, coins can represent a place by showing different objects. It is a circle design that is very common in our daily life. I used to collect different coins when I travel to a new place, and it can remind me how beautiful the places were. During the lesson, we watched a silent video about Josef Albers teaching at Yale. He demonstrated the possibilities of seeing a circle, for example looking a circle with different angles and perspectives. 05

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

The idea of a circle During the workshop, our group thought about what makes a circle. We discovered that everything could be a circle when it rotates, the path of the rotation can form a circle. Therefore, we made a video about the rotation of different objects and implemented our concept. We also looked into visual references that related to a circle, such as Penwald drawing by Tony Orrico. He used his body to draw a circle and created many large-scale artworks.

Reading materials I read some books and articles about a circle, including “The basic elements of visual communication”, “Square, Circle, Triangle” and “Complete studio tips for artists & graphic designers”. I found different shapes have different cultural and historical meanings. The circle reference inspired me to think about the cycle of time. Every object has a cycle, after some time, it will go back to zero, like sunrise and sunset, birth and death, clock cycle.

Visual reference After studying about the meaning of circle, I was thinking to create a book that is never end and related to space. I looked in to the nature of sparial, 360 degree book and paper folding. The book designer I amired the most was Yusuke Oono. He created a series of laser-cut storybooks including ‘Jack in the Beanstalk’ and Mount Fuji. These books are comprised 40 images bound into a book that can be fanned out at 360° creating a narrative that can be explored from multiple angles.

Armin Lindauer I read an interesting book about information design and data visualisation. This book is called “Experimental design: visual methods and systemic play” by Lindauer, Armin. Armin Lindauer shown some ideas about the relation of dots, lines, arrangments, brightness, forms sand motions. He designed different information graphics and inspired me to think of the movements of a circle.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

IDEAS DEVELOPMENT STUDIES | DRAFTS | REFINE IDEAS

Above: The sketched of the circle publication. Right: These images show the pototypes of the circle book.

Thinking about the circle, the first thing that comes to mind is 360 degree, round, complete, spacious and connected. Therefore, I started to explore different methods to represent a circle and came up with the ideas of an endless book. At first, I made the circle book with my hand. However, my paper cutting skill is not perfect, the edges were not good. Thus, I was thinking to use digital fabrication to develop my ideas.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PROTOTYPES

EXPLORING MATERIALS | PRODUCTION METHODOS

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

EXPERIMENTATION MATERIALS | WORKING PROCESS

I also studied about different materials that can be used for laser cutting and decided to experiment with paper cards. I discovered that laser cutting machine could be used for die cutting, engraving and drawing scoreline. I also talked with the staff from the material area in the library. She recommends me to try Polypropylene paper. I enjoyed a lot in choosing materials. I love the texture of different materials.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Above: The materials study about laser cutting. Right: This image show the laser cut prototype.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Circle Symbolizes Perfection 11

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

THE SQUARE BOOK

THE STUDY ABOUT LAYOUT, COMPOSITION AND SEQUENCE

War

Anarchy

Fatigue

Dependence

You

They

Hunger

Control

Loyalty

Bias

Hesitation

She

Except

Them

Either

All

Freedom

Above: This image shows the outcome of the square workshop. Left: The poster design for the circle workshop. Right: The final layout design for the square publication.

In the square workshop, we learnt about using black squares to design layout and composition. By using different sizes and positioning the black squares, we can create different meanings and feelings. During our experiments, I find the relationship between black squares can help to define different keywords. I like to see other students work too. I feel excited when I find other ways to present the same keyword. I also thought about the sequence during my process, and it can help to tell a story.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

RESEARCH & ANALYSIS READING MATERIALS | WORKSHOPS | VISUAL REFERENCE

Above: The documentation of the square workshop. Right: Examples of the black squares exercise.

In the square workshop, we watched the Quad performance by Samuel Beckett. There were four actors in the Quad play. They walked in across the square stage, and never touch each other. After studying about this performance, I found the Quad diagram amazing. In the second part of the lesson, we had a black square exercise. We tried to demonstrate pronouns and abstract concepts with black squares. 13

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Reading materials

Wucius Wong

In the square session, I read some books, including “Visual literacy” by Judith Wilde and “Language of vision” by Gyorgy Kepes. I learnt more about the black square solutions and different ways to see the cubes. I found the position of shapes can change the look and feel, create different messages and relationships.

The book “Principles of two-dimensional design” and “Principles of three-dimensional design” had strongly influenced my work. Wucius Wong had demonstrated how to use the fundamental elements of form and shape to create different artworks. He tried to construct and deconstruct the shaps. I like the experiments and methodologies that he used.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

THE TRIANGLEBOOK THE IDEA OF THE TRIANGLE BOOK

Above: This image shows the triangle publication. Left: These are the reflection forms of my project. Right: Olfa ads, designed by Hideto Yagi.

After designing the circle and square publications, I found myself fall into the idea of space of different shapes. I enjoy a lot in making physical publication and decided to keep on. The reflection forms help a lot in summarising my design direction and moving forward to the next stage. In the triangle session, I was impressed and inspired by Hideto Yagi, a Japanese designer who created a series of posters for olfa. Thus, this time I tried to use olfa cutter to make my work.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

RESEARCH

READING MATERIALS | VISUAL REFERENCE

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PROTOTYPES

EXPLORING MATERIALS | PRODUCTION METHODOS

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

FINAL OUTCOME THE TRIANGLE BOOK | PRODUCTION

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PART TWO: DESIGNING SYSTEMS

Developing design systems for the future of healthcare communication

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

ABOUT MY PROJECT PROJECT OVERVIEW STATEMENT

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Above: This image shows the presentation of our work.

In the second part of the Information and System, we were asked to design systems with Ogilvy Healthworld. We were working as a group of four, including Wing Lor (Roberta), Sharine Chan, Ella Alder and Eugene Angelo. As a small team, we worked closely with each other. My role was information coordinator and digital designer. I was responsible for researching, organising information, creating a responsive web design and email newsletter, designing branding guideline and preparing presentation materials. Throughout our project, we considered the real situation of healthcare communication and designed a series of practical solutions. Our group spent most of the time on developing the system for the lay summary documents.

Above: This image shows my suggestion for the lay summary document

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

THE TYPOGRAPHY STUDY THE DOCUMENTATION OF TYPOGRAPHY WORKSHOP | RESEARCH

During the typography workshop in unit 7 and unit 8, we explored new ways of forming sentences. We experimented the cut-out workshop with our reflective statements. I discovered new combinations of my words, which is exciting. We experimented with different layout design, such as single column, double columns and random placing. We tried to arrange in various positions and form different structures.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Above: This image shows the outcome of the cut-out workshop with our reflective statements. Right, Top: This image shows the outcome of the typography and layout workshop. Right, Bottom: This image shows how the capital letter and lowercase letter works.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

IDEAS DEVELOPMENT

THE DOCUMENTATION OF OUR GROUP MEETING | SYSTEM FLOWCHART

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

IDEAS DEVELOPMENT THE DOCUMENTATION OF OUR GROUP MEETING | DISSCUSSION

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

SYSTEM OVERVIEW THE FLOWCHART OF OUR SYSTEM

Above: This image shows the flowchart of our system

The Communication System

Code Generation

Flow is convenient to use for designers, patients, friends/family of patients and doctors/nurses. It was designed with scalability in mind, meaning that machine learning and generative adversarial networks could be implemented later down the line to automate the production of deliverables fully.

A study is analysed to generate a code. There are six points of analysis, each with several possible answers, that help to define the study’s relevant audiences and their requirements of the information. The code is assembled from these answers and acts as a central reference point for the rest of the system. Every part of the code has a resultant effect on how the study’s information is organised, filtered and communicated as a set of deliverables. For example, if a study was about medicine for a minor, short term ear problem occurring in males aged 19-55, the code would be ‘05-M-4/5/6-I-ST-1’.

The system is split into four sections: Code generation, hierarchy, information filter and visual output. A medical study is analysed to generate a code, and this code determines how its information is sorted, filtered and communicated.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Hierarchy & Information Filter

Visual Language & Output

It is required that each study has twelve main sections. These sections are organised into a hierarchal order based on the code. This helps to meet the audience’s needs in terms of what information they consume first. Each part of the code assigns a different ‘priority value’ to each section of information - we designed an aggregate system that automatically creates the hierarchy of information even if there are conflicting values. After the sections of information are organised, the information within these sections is filtered in four different ways: academic, non-academic, quick and urgent. These all vary in detail. This ensures that the information communicated in each deliverable is clearly defined.

A website is produced for every medical study as a ‘base level’ access point for the curious layperson, academics, non-academics and patients wanting to find out more information. The website also utilises an email list to send updates and studies to those of concern. Either an assertive or comforting set of deliverables are produced depending on the code. The basic rules of composition, colour, typography and medium are specified in the system’s brand manual.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

THE TYPOGRAPHY STUDY THE DOCUMENTATION OF TYPOGRAPHY WORKSHOP | RESEARCH

Thinking With Type “Thinking with type: a critical guide for designers, writers, editors, & students” is written by Ellen Lupton. I learnt about how to use grids and columns with golden sections. I found that single-column grids work well for simple documents, while multi-column grids provide flexible formats for publications that have a complex hierarchy or that integrate text and illustrations. This is useful for making design decisions.

Color & Human Response “Color & human response: aspects of light and colour bearing on the reactions of living things and the welfare of human beings” is written by Faber Birren. I learnt about human response towards different colours and how to apply them in different situations. This book has influenced us in choosing an appropriate colour for our project. We considered the importance of using comfort colour in our medical approach.

Dyslexia Style Guide 2018 "Dyslexia Style Guide 2018: Creating Dyslexia Friendly Content" is published by British Dyslex!a Association. This style guide suggested important reminders about universal written communications. It reminded us to consider different users. It influenced us to think about readable fonts, colour usage, layout design and writing style. Our medical approach should be user-centred.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PRESENTATION SLIDES THE CONCEPTS OF THE SYSTEM | RESEARCH FINDINGS

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PRESENTATION SLIDES EXPLANATION OF HOW IT WORKS | INFORMATION FILTER

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

DEMOSTRATION

MATERIALS | WORKING PROCESS | BRANDING GUIDELINES

Above: This image shows the branding guideline and material choice.

Typefaces: Frutiger A humanist sans-serif typeface can help to establish an appealing and comforting medical approach. Frutiger was intended to be clear and highly legible at a distance or at small text sizes, which is suitable for the healthcare communication. Font Size The type sizes were chosen according to the golden section and Fibonacci rule, which are 6, 8, 10, 13, 16, 21, 26, 34, 42, 55 and 68. 37

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

Material For the material selection, we recommend to use pastel coloured paper. The advantage of pastel coloured paper is that it can help the whole medical report stand out as well as making it easier for people with dyslexia to read. Colour Palette For the colour selection, we recommend to use mono-tone instead of various colours. The advantage of mono-tone colour is that medical organization can save money on printing cost.

Above: These are the pototypes of our project and the examples of the branding guidelines. UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

DEMOSTRATION MEDIA| WORKING PROCESS

Above: This image shows the presentation table. Top, Right: This is the email newsletter design. Bottom, Right: This is the responsive web design.

Electronic Direct Mail (EDM) The email newsletter can be use for medical promotion, to inform the patients about the latest information about different health issue. Responsive Web design It is an approach that suggests that design and development should respond to the userâ&#x20AC;&#x2122;s behavior and environment based on screen size, platform and orientation. Our group decided to make a responsive website for both computer, tablet and smartphone, people can get the information in anytime and anywhere.

UNIT 7: EXPLORING PRACTICE 2 | INFORMATION & SYSTEM

PART THREE: Automate!

Automate a creative or designerly act, while speculating on your role in the workplace of the future.

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

ABOUT MY PROJECT PROJECT OVERVIEW STATEMENT

Above: This image shows the key decisions map from the first workshop

I began in unit 7 from information and system to strategy and identity. During this unit, I gained new visions of design from different aspects and historical studies. In the first strategy and identity workshop, we were asked to draw a diagram about our key decisions from the previous project. I found myself working in a very similar pattern among all the projects I had so far.

There are 12 stages in my working progress and it is a cycle. I first receive a brief and brainstorm as many ideas as I can. Next, I will study the subject and select one design direction. Then, I will look for a similar theme from different artists and designers to prevent doing something similar. After that, I will do the testing and prototyping. Lastly, I will come up with a final solution and ready for the critic. Usually, after the critic, I will start to do the documentation and reflection. These are essential for building a portfolio.

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

THE CAREER TOOLKITS THE FUTURE OF EMPLOYMENT | OPEN STUDIO | MINDMAP

Left: This image shows project threeâ&#x20AC;&#x2122;s open studio session.

Above: The image shows my brainstoming process.

In the strategy and identity platform, we explored the idea of automation and imagined the possibilities of the future world. My theme is about the future of employment and standardisation. The initial thought is to create a career toolkit for future recruitment. I tried to imagine what will happen from the next ten years to the next fifty years.

Resume becomes our label and product description. In the modern world, companies started to compare our capabilities with robots. Automation is the future. We have to think about how can we collaborate with automation, use it as a tool and make it become our companion. The future of success is to work together.

In the real recruiting environment, the education levels, working experiences, skills and achievements become our values. Human beings are standard products. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

IDEAS DEVELOPMENT THREE PROPOSALS FOR AUTOMATION | INITIAL IDEAS

Left: This image shows the initial ideas about automation.

Above: This image shows the selected direction

I first came up with three ideas, these are “The Stationery Organiser, “The Automatic Cube Shop” and “The CV Generator”. The idea of the stationery organiser is to assist design students, every time, after the submission, my table becomes a mess. I was thinking to create a robot that can help to tidy up my room, like a housekeeper. Another idea is an automatic cube shop. I came up with the idea of combining the vending machine and consignment shop. Individuals can consign their products for sale by renting a cube at a low cost. I am inspired by the unmanned stores.

The third idea is to create a CV generator for future employment. My concept is to generate a CV that aligns with specific jobs. For example, some jobs may not require education and some jobs may not require working experience. How can we personalise a perfect profile for the recruiter and get a better career? After first crit, I decided to work on the future of recruitment. The three keywords are “Future”, “Employment” and “Standardisation”.

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

RESEARCH & ANALYSIS RESEARCH | THE FUTURE DEVELOPMENT | RECRUITMENT DESIGN

Left: This image shows the initial ideas about automation.

Above: This image shows the selected direction

During the research process, I tried to imagine what will happen from the next ten years to the next fifty years.

and machines, as well as the standardisation in the modern world.

What I am questioning about is to what extent can we rely on automation and mechanisation. Will automation take control of the future of recruitment and employment? Or will humans take control and treat automation as a tool? Or will automation and human managed to be share control? I think automation can be developed in three flows and directions. In my studies, I mainly focused on the relationship between humans

I was inspired by the book “The age of automation” by Bagrit Leon and “Automate This” by Steiner Christopher. They mention about the trend of automation and how companies identify us with our personalities. As a result, I designed a system to identify different applicatants with a code. According to the code, the system can generate different CV approaches and give advices on choosing career. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

APP DEVELOPMENT

USER INTERFACE AND USER EXPERIENCE DESIGN | MOCK-UPS

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

SYSTEM DEVELOPMENT 16 PERSONLITITIES | DATA VISUALISATION | COLOUR SELECTION

There is a chapter called “Categorising Humankind” in the book “Automate This”. All of us have a personality type. All of us, when observed by an expert, can be categorised, tagged and catalogued like an animal in a zoo. Many companies will ask applicatants to take a personlity test before they have the interview, such as Nasa, Microsoft and 3M company. Therefore, I found it is essential for applicants to understand their personality 51

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

and select a relevant career path. The design of my system will ask users to take a personality test. According to the test result, users can understand their way of thinking and behaviours. The Myers-Briggs Type Indicator (MBTI) organises personality into 16 distinct types. People can be characterised by their preference of general attitude like “Extraverted (E)” or “Introverted (I)”, “Sensing (S)” or “Intuition (N)”, “Thinking (T)” or

“Feeling (F)”, “Judging (J)” or Perceiving (P). After getting the personality result, the system will make a data visualisation with the personality chart. With this chart, we can generate a series of visual identities and create a career toolkit. Users can use it in the interview or job application.

Colours can represent different personalities. The book “Best Practices for Graphic Designers, Color Works” has demonstrated how to apply colour theory in branding and Information Design. In this system, red can represent passionate, yellow can represent optimistic, blue can represent loyalty. I tried to analysis the strength of different personalities and associated them with a colour. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

PROTOTYPES

APP FUNCTIONS | CAREER TOOLKIT | VISUAL IDENTITY

Above: This image shows the career toolkit. Left, Top: This image shows the functions of the career toolkit app. Left, Bottom: This image shows the name card design.

After all, I made a series of prototypes for both online and offline situations. Online includes an app design with career coach and offline includes a toolkit with a resume, user guide, name card and personality analysis. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

POSTER DESIGN DIGITAL PRINTING | HAND-DRAWING

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

Left: A1 Poster Design for Automation.

Above: The development of the poster design, drawing with maker, 4B and 8B pencils.

The robot-like human

The human-like robot

Human is being standardised in the modern world. Are we thinking and acting like a machine? We have a set of rules & regulations that we strictly follow.

The robot is an artificial human body without soul. It is a tool, an extension of humans and a companion. The future is a teamwork between humans and robots.

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

EXPERIMENT

COMPUTER-GENERATED TEXTURE | HAND-DRAWING PATTERN

Above: This image shows the experiment of using computer generate different patterns. 57

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

Above: This image shows the experiment of hand-drawing different textures. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

FEEDBACK

THE IDEA OF THE TRIANGLE BOOK

FEEDBACK

UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

Left: This image shows the feedbacks from other students. Center: This image shows the discussion and feedbacks with the tutor. Right: This image shows the notes of refining ideas.

Lastly, stepping back to my own practice, in my opinion, the future role of designer is difficult to replace by automation, because conceptual and creative thinking cannot be done by the machines. We can collaborate, automation can be the role of team worker and implementer by transforming the ideas into execution. UNIT 7: EXPLORING PRACTICE 2 | STRATEGY &IDENTITY

Design & printed by Wing Lor (Roberta), Central Saint Martins, 2019