Issuu on Google+

WOO! Print & Mobile App A Resource For Students

BY KATIE JOHNSTON


1. CONTEXT


IS PRINT DEAD?

Word on the street is that print is where words go to die. They get trapped on the page and end up in the recycling bin. Those poor, poor words. Things are moving digital... why? Because they are searchable, linkable and out there for anyone to discover. For this project I was assigned to output the Woo publication, which is Emily Carr Universitys Student Print Publication, to 2 different media. This ‘redesign’ of the existing publication is meant to make it more dynamic, readable and perhaps interactive. In order to do so it is important to focus on a specific target audience and also to maintain a level of consistency no matter the platform. For this project the focus is on knowing how the print industry is changing, what the pundits say and how to effectively work with this. It is in a state of flux so it is important to know other platforms available to output information besides print and what they do best to capture users interest.

1. CONTEXT


2. RESEARCH


CHOICES

The first area of research was simply figuring out what alternative there are to print. These options include: website, Ipad, Iphone and E-book. All of these options are portable, accessible, easily legible and provide seemingly endless information compared to print. However, some prove to be more expensive than others; for instance to develop an iPad app would cost way more than a website. Ipad is also quite a bit newer than the notion of a website. The one thing that print does offer however is that it is still relatively affordable, especially in terms of a school budget. It is also tangible, and provides a memento of Emily Carr University. Research on these options will provide evidence to which ones will work the best as an alternative to the student run publication, Woo.

2. RESEARCH


Pros:

Web: Accessible, endless information available, portable, connectable, legible, easy access, affordable Ipad: Geolocation, Endless info,interactive, easy access for feedback Print: tanginble, memento, legible, can be affordable iPhone: Most people have them, connectable, portable, interactive E-Book: Easily Legible, read for longer periods of time

SO, WHICH IS THE BEST OPTION? Cons:

Web: interaction can be limited, sometimes unclear Ipad: too new, expensive Print: connectability is lost, temporary, energy inefficient iPhone: The few that don’t have them miss out E-Book: Limited to iPad for readability, minimal interactivity Since the Woo is a student run project, the expensive and exclusive options like iPad and E-book would be ruled out. There just isn’t a big enough audience. Things like mobile app and print are framiliar options to students

2. RESEARCH


WHAT ALREADY EXISTS?

Observations made while going through past issues of the Woo publication on aesthetic and usability.

A The format of each issue is extremely different, this one is confusing and unfolds too large, the user does not know where to focus.

B The word Woo! Is prominent on this issue but not always on other issues

C This appears to be standard booklet format but has a pamphlet that comes out which is confusing to the user

2. RESEARCH


D Color and type are playful in each issue, but don’t always correlate or work together.

2. RESEARCH

E The showcasing of student work is random depending on the format, here it is easy to see where the student work is, in others it is unclear.


Observations I made on the existing Woo website. Overall I don’t feel any sense of a wow factor or interest in coming back to the site as a current student.

A There is a distinct square and blocky look to the website

B The sections are confusing and it is not clear where each separate issue can be viewed

C The colors are muted and do not reflect a funky art school vibe

2. RESEARCH


D Works within an issue are divided up into categories which can be annoying and time consuming

2. RESEARCH

E ‘Our Random World’ randomizes images at the bottom and can be confusing for the user if they want to go back and find something again


PRINT & MOBILE APP After analyizing what already exists the decision on which two platforms to redesign the Woo publication for became clearer. I decided that it would be necessary to create a mobile app as well as a more refined print publication. I also decided that I wanted to work with a specific target audience: students. I think that students are often confused about the Woo and since it is their publication it should me more clear and accessible. The most common thing that I have noticed here at Emily Carr is that almost everyone has an iPhone and therefore a mobile application would be just what students need. However, since the Woo is traditionally a print publication I felt it was necessary to stick with print as a medium. I think that it can work well within a student environment if it is cohesive, memorable and easily located.

The next step in research was to look into mobile app and print specifically in order to figure out how to make both platforms dynamic and useful to the student audience. I decided to go with finding out what elements from iPad applications can inform the print (and also mobile) platforms.

2. RESEARCH


A Ipad apps keep menu options simple and clear so the user doesn’t get overwhelmed, they lay out exactly what to expect

B Ipad applications take advantage of simplicity, they cut down on blocks of text and make line lengths shorter for easier readability.

C The reason iPads are so popular is simply becuase of interactivity, if print can utilize some sort of tanbgible interactivity it becomes much more dynamic

I think that print could benefit most from these observations, as the problem with print is that people want information rapidly, nobody reads large chunks of text anymore that print known for.

2. RESEARCH


EXISTING APPLICATIONS FOR INSPIRATION

The mobile platform would need to organize lots of information about the Woo publication and other aspects of Emily Carr in one place.

The Museum of Modern Art mobile app has a simple menu with clear options. It also has a display of work at the top which is something the Woo app would need to utilize. I also like how there are different colors for each section displayed at the top.

2. RESEARCH


TED and Groupon are both apps that feature simple menu options yet each option holds a multitude of information at the users grasp. I think that the use of the bar at the bottom is the key feature of these apps that makes them user friendly.

2. RESEARCH


I was excited to come across a technology I had completely forgotten about, QR codes. They help bring print back to life in the sense that a user could see a QR code on a piece of print and use it as a gateway to a whole other land of information. This would help the Woo publication tremendously.

QR CODES ARE PRINTS BEST FRIEND 2. RESEARCH


2. RESEARCH


DEFINITION STATEMENT After researching the two areas I picked specifically to work with (print and mobile app) and defining my target audience as being students, I know how to solve what I feel are the problems with the Woo publication. I will be creating a print piece that is simple and yet more dynamic and memorable than what already exists. This print piece will have an element of interactivity within it to lead the user to the mobile app. The app will be a continuation of the print in order to showcase student work while bringing other useful elements to students within it. I feel like the main problem with the woo publication is that it doesn’t do what it should essentially be doing well enough. It should be showcasing student work in a clear, concise manner and bringing students closer as a community. But it gets confusing with it’s many forms and plainly formatted website, and they definitely don’t work together cohesively. It becomes unclear to students what the publication is doing and gets lost in translation in print and in the web. Therefore outputting the Woo in print but redesigning it will help get the message clearer on its purpose, which is to be there for students. Outputting it as a mobile app will create a place students can go and learn about each other and see what actually goes on around them in school. The target audience is the most important piece of this whole design, and I believe students will get more out of it. Students at Emily Carr are tech-savvy and crave an easy mobile way to know what is going on around the campus and also still appreciate the art of print so I feel print and mobile app will be very effective as platform choices.

2. RESEARCH


3. EXPLORATION


3, EXPLORATION

Here I worked with the idea of a poster being a collection of triangles that make up a whole and then to continue that aesthetic onto the app.


These sketches are my first exploration on what the print, web or app could look like. On the far right I was reminding myself that the main goal of this is to act as a display for student work. I was also thinking in terms of the print being the first step in a user experience.

3, EXPLORATION


3, EXPLORATION

These sketches were iterations on the format for print. I was thinking about different ways it could fold and display information.


I thought it might be interesting if it had a package that the Woo came out of

3, EXPLORATION


3, EXPLORATION


Continuing with the idea of an accordian folding print, this is where I start to think of multiple issues working together to create a poster

3, EXPLORATION


Thinking about how they will stick on the wall and to each other.

3, EXPLORATION


Maybe having an envelope for each issue? This sketch shows a person opening the Woo and putting it on their wall

Some thoughts about the mobile App begin to start

3, EXPLORATION


Here the sketches are based on initial thoughts on how the mobile app will work. On the left it shows the idea that a WR code would be placed on the print that leads to the mobile app and shows the user what they could do with the print.

3, EXPLORATION

Above is showing how the prints could look on a wall together


Some sketches on what the actual mobile interface could look like

3, EXPLORATION


These are more about the aesthetic for the mobile interface, and how to display a meny to students featuring the categories: current, past, about, search and more.

3, EXPLORATION


Here is a beginning wireframe for the mobile app.

3, EXPLORATION


4. FINAL CONCEPT


STEP ONE My final concept for my print is based on the user experience of the student. The first step in this is the student knowing where to pick up the current issue of Woo. One thing that lacks in the existing Woo is that most students don’t even know about it. Here it shows a clearly labelled place on where to get the Woo that would always be located in the same place in order to gain some framiliarity with students.

4. FINAL CONCEPT


This is what students will be looking at when they get the print version of the Woo.

STEP TWO: THE WOO! PUBLICATION WOO! WOO!

MOBILE ME

KEEP ME

KEEP ME

2

1

WOO!

2

1

ARTIST NAME

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

Welcome to the new woo. We have reinvented ourselves in more ways than one and are excited to share this with you. As well as drastically changing our publication format, we have a brand spankin’ new mobile app for your fingers to enjoy. Keep up on the latest news, goings on and work happening at the Welcome to the new woo. We school. have reinvented ourselves in more ways than one and are excited to share this with you. As well as drastically changing our publication format, we have a brand spankin’ new mobile app for your fingers to enjoy. Keep up on the latest news, goings on and work happening at the school.

ISSUE ONE - FALL 2011

1 1

TITLE OF WORK ARTIST NAME media 10x10 On the ‘cover’ of this issue is work by -insert artists name here-. Check out her full bio on the mobile app .

TITLE OF WORK ARTIST NAME

TITLE OF WORK ARTIST NAME media 10x10

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

TITLE OF WORK ARTIST NAME media 10x10

4

TITLE OF WORK ARTIST NAME media 10x10

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here.

media 10x10 On the ‘cover’ of this issue is work by -insert artists name here-. Check out her full bio on the mobile app .

5

4

2 2 3 3

TITLE OF WORK 3 media 10x10

ISSUE ONE - FALL 2011

WOO!

3

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here.

4 6 4 56 5

TITLE OF WORK ARTIST NAME media 10x10

5

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

TITLE OF WORK ARTIST NAME media 10x10

6

TITLE OF WORK

Information about the workARTIST and the artist NAME information here Information about10x10 the media work and the artist information here about the work and the Information Information about the work andinformation the artist here. Information artist information here about the work and the artist

TITLE OF WORKMOBILE ME ARTIST NAME media 10x10

6

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

TITLE OF WORK ARTIST NAME media 10x10

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

information here Information about the work and the artist information here.

TITLE OF WORK ARTIST NAME media 10x10

Information about the work and the artist information here. Information about the work and the artist information here Information about the work and the artist information here.

4. FINAL CONCEPT


WOO! Each panel is a separate work by a different artist.

The final print version features a QR code on the first side that brings mobile users to the mobile app.

WOO! KEEPKEEP ME ME

1

1

WOO!

These numbers correlate to the numbers on the second side in order to give the user ISSUE ONE - FALL 2011 artist information Welcome to the new woo. We

WOO!

2

2

TITLE OF WORK ARTIST NAME media 10x10

4. FINAL CONCEPT

2

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

1

have reinvented ourselves in more ways than one and are excited to share this with you. As well as drastically changing our ARTIST NAME publication format, we have a media 10x10 brand spankin’ new mobile app On the ‘cover’ of this issue is work by for your fingers to enjoy. Keep up Welcome on the latest news, goings onto the new woo. We-insert artists name here-. Check out and work happening the haveatreinvented ourselves in her full bio on the mobile app . school.

TITLE OF WORK

ISSUE ONE - FALL 2011

3

more ways than one and are excited to share this with you. As well as drastically changing our publication format, we have a brand spankin’ new mobile app for your fingers to enjoy. Keep up on the latest news, goings on and work happening at the school.

1

TITLE OF WORK ARTIST NAME media 10x10 On the ‘cover’ of this issue is work by -insert artists name here-. Check out her full bio on the mobile app .

4

TITLE OF WORK ARTIST NAME media 10x10

3

TITLE OF WORK ARTIST NAME media 10x10

2

Information about the work and th information here Information abou and the artist information here Info about the work and the artist inform

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here.


MOBILE ME

5

TITLE OF WORK ARTIST NAME media 10x10

4

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here

The other side features a QR code that leads the user to a screen that shows them the ARTIST NAME different ways they can use media 10x10 about the work and the artist theInformation print by putting it on the information here Information about the work and the artist information here Information wall.

5

TITLE OF WORK ARTIST NAME media 10x10

6

Information about the work and the artist information here. Information about the work and the artist information here Information about the work and the artist information

6

TITLE OF WORK

about the work and the artist information here

Put this issue on a wall or surface

KEEP ME

WOO!

In any format you like

KEEP ME

WOO!

To create your own poster

KEEP ME

4. FINAL CONCEPT

WOO!


WOO!

WOO! Emily carr’s student publication CURRENT

Hopefully the student would have been lead to the app by taking a picture of the QR code on the print.

4. FINAL CONCEPT

PAST

ABOUT SEARCH MORE

For the mobile app I decided to go with a distinct black background and a colorful palette for the menu. Since the focus of the app is the menu, I decided that’s where I want the color and focus to be. Also, within the circle element is a preview of artists work that automatically shifts while you are using the app before making a menu choice.

STEP THREE: THE APP


WOO!

CURRENT

PAST

WOO!

ABOUT SEARCH MORE

CURRENT

Above shows the shifting of artist work sequence.

PAST

WOO!

CURRENT

ISSUE 1

ABOUT SEARCH MORE

Above is where the first menu option, current takes you. The user is able to swipe to the left to go through the current issue.

4. FINAL CONCEPT


WOO!

CURRENT

ISSUE 1

WOO!

CURRENT

ISSUE 1

This shows the sequence of swiping to the left in order to get to the next work within the issue.

4. FINAL CONCEPT

WOO!

CURRENT

ISSUE 1


WOO!

CURRENT

TITLE OF WORK

ISSUE 1

ARTIST NAME

media 10x10

WOO!

ARTIST NAME CURRENT

ARTIST NAME

ISSUE 1

VIEW FULL PROFILE

Recent Work

Information about the work and the artist information here Information about the work and the artist information here Information about the work and the artist information here.

TITLE OF WORK media 10x10

CONTACT BIO SHARE SEARCH

The orange bars that appear over top of the works are able to be pulled out by the user in order to view artist and work information and there is also the option to continue to the artists full profile.

Here is the artists full profile view.

4. FINAL CONCEPT


WOO!

PAST

WOO!

PAST FALL 2005

ISSUE 10

WOO!

ABOUT

OUR DIG.

The Woo is Emily Carr’s University student-run publication. We publish student work done inside and outside school. We want to get your work out there to other students, faculties and artists around Vancouver; all degrees and years are welcomed! We will also publish topics that interest ECU students, so please submit both your work and your suggestions. This is your magazine!

ISSUE 3 - FALL 2011

The pink circle appears when the user places their finger over, to select an issue they can tap.

4. FINAL CONCEPT

THE TEAM

Here is the sequence showing the menu option ‘past’ where users can go to look at past issues of the Woo. On the right is the option ‘about’ which tells the user about those who are part of the Woo team.

SUBMIT


WOO!

WOO!

TEAM

WOO!

TEAM

SEARCH

HAYLEE Haylee is an avid team member of the Woo! She enjoys typography and pubication design as well as hanging with her Woo! pals.

HAYLEE

FULL PROFILE

This menu works the same way as the ‘past’ menu, the green circle indicates which option you will be choosing and brings you to a team members full profile.

CONTACT

SHARE

ARTIST PROFILE

CURRENT

PAST

ABOUT SEARCH MORE

The search menu is simple and open to the user.

4. FINAL CONCEPT


WOO!

MORE

NOVEMBER 2011

WOO!

WOO!

MORE

NOVEMBER 2011

MORE

NOVEMBER 2011

Interactive Futures 2011 Animal Influence

Wednesday, November 2 2011 (All day) Saturday, November 19, 2011 (All day) read more

CALENDER JOB BOARD CALENDER JOB BOARDMAIL MAILPROFILES

CALENDER JOB BOARD CALENDER JOB BOARDMAIL MAILPROFILES

Under the ‘more’ option comes some things that are helpful for students. Here is the calender that shows up automatically.

4. FINAL CONCEPT

CALENDER JOB BOARD CALENDER JOB BOARDMAIL MAILPROFILES

The user can pick a date and tap and bring up a summary of information on what is going on that day. Dates with pre-existing events are already circled.


WOO!

WOO!

MORE

NOVEMBER 2011

Interactive Futures 2011 Animal Influence

Wednesday, November 2 2011 (All day) Saturday, November 19, 2011 (All day) Interactive Futures (IF) 2011 presents the theme Animal Influence spotlighting nationally and internationally recognized media artists’ work influenced by the growing wealth of knowledge on animal behavior, cognition, creativity and consciousness. Research from such fields as biology, psychology, cognitive science, zoology and philosophy focusing on new understandings of animal life are helping to shift assumed conventions concerning animal cognition, consciousness, and agency.

read less

CALENDER JOB BOARD CALENDER JOB BOARDMAIL MAILPROFILES

If the user wants more information about an event they can choose to read more or less about it.

WOO!

MORE

position

deadline

Global Citizens Club President

Ongoing

On-Call Audio-Visual Technician

Ongoing

Teach English in Asia

December 11th 2011

Youth Internship Program

Ongoing

Art Call - Ongoing

January 2012

The Small Business Internship

Ongoing

Program for 2011-2012

March 2012

Male and female life drawing models

Ongoing

Graphic Design Internship

Ongoing

Call for Art Submissions

Ongoing

Interactive Designer

Ongoing

3D Designer

April 2012

Social Media Rep

December 1st 2011

Marketing for Design

Ongoing

CALENDER

JOB BOARD

MAIL

MORE

USERNAME PASSWORD log in

CALENDER

JOB BOARD

MAIL

The job board option and mail option (on the right) can also be seen under the ‘more’ category.

4. FINAL CONCEPT


5. SELF ASSESSMENT


REFLECTION I will start off by stating what I feel to be the strongest about my project, the concept. I spent most of my time trying to think of an interesting way to redesign the print format in a way that art students would enjoy. I feel that the concept of creating something lasting and tactle out of the print is strong, and also the way that it connects with the mobile app. The way that they interconnect and would work to bring students together or more informed is something I feel I accomplished. I wanted to make the print carry the same format over each issue to create framiliarity. However, where I struggled with this project was in the finishing aspect. I let time dwindle away and would have liked to have spent more time actually designing the user flow of the mobile app so that it has more sequences. I do feel I did my best with the time given but there are flaws in parts like where the QR codes lead and what those screens would look like. I also think I would have liked to add in more user trials with this project. Perhaps printing some of the issues I designed off and actually getting people to try and put them on the wall and take some photos, to really capture the interactivity. I also would have liked to focus on the sequence of the actual user experience, from step one of picking up the issue to the user downloading and using the app. I also feel I could have spent more time researching in the beginning on more ways that print could be more dynamic. If I were to do this project over I would spend more time rapidly generating ideas in the beginning instead of taking one idea and taking a more linear approach to see what it turns into. In general I am happy with the outcome but could have spent more time working out fine details. 6. SELF ASSESSMENT


Woo! Process Book