*Designing Voracio.usâ€ƒ Lyanne Dubon
Everything is Amazing and No One is Happy Designing Voracio.us Lyanne Dubon
LOUIS CK ON THE CONAN O’BRIEN SHOW, SEPTEMBER 2010 “Everything is amazing right now and nobody’s happy. Like in my lifetime, the changes in the world have been incredible.”
Introduction The Internet has been around for less than fifty years. In that time it has managed to flourish and produce a majority of the modern technologies we are familiar with today. Despite improvements in technology and user interfaces, people are continually disenchanted with the web and its resources. A significant population of web users are unable to navigate and digest the Internet. I know this from firsthand experience. In my household, my sister and I are the de facto tech support for our parents. It’s a struggle to help our parents adapt to new technologies and it takes a lot of patience and hands-on participation. It was hard for me to recognize how overwhelming the internet was for them. One day my mom put it succinctly: “I just don’t know where to start.” This was a problem, and I wanted to contribute to a solution.
Where to Start In order to begin my thesis explorations, I began brainstorming my connections to digital technology. Despite studying graphic design, I have a strong connection with technology. In the 8th grade I made the decision that I was going to work with computers. As a result, I applied and attended a math, science and technology high school â€“ absolutely certain I was going to become a programmer. For the next few years I learned everything about engineering and computer programming. Around the same time, a friend introduced me to graphic design. Very quickly, my enthusiasm for design surpassed my attachment to technology. When high school ended, I knew I wanted to study graphic design â€“ not technology. Then something peculiar happened. The line between the design and technology disciplines began to blur. Suddenly I met designers who were programmers and vice versa. This changed everything. Now I was inspired to combine my skills as a programmer and designer to create new design solutions.
CLOCKWISE FROM TOP LEFT The Laws of Simplicity John Maeda PRINT Magazine, October 2011 Guest Contributors: Metahaven The New Way Things Work David Macaulay Being Digital Nicholas Negroponte
Research THIS PAGE Trace AIGA Journal Of Design V1/N1 2001 AIGA The Art of Looking Sideways Alan Fletcher
I began to look at printed resources that combined digital and design interests. All of the reading materials shown directly influenced the formation of my initial thesis.
Thesis Digital Journal â€“ thesis.lyannedubon.com
Evernote Links Repository
Keeping Track of Aha! Moments I needed a place to store all my exploration data and synthesis. It was easiest to store analog data in an analog form (notebook). Sorting through digital articles proved to be more difficult. A solution to storing digital data was to create a thesis blog and links repository where I could visit any documented article, video or image easily.
October 31 2011 We sacrifice personal data for convenient web services. These services monetize our identity (determined by user-contributed data impossible to fabricate) in order to generate value and business leverage.
November 7, 2011 Users have the influence to improve web services, but lack the encouragement and vocabulary to formalize demands. Once this schism between developers and audience is eradicated, web services will unite our digital and physical self.
The Beginnings of a Thesis Topic With research in hand, I began the task of narrowing my thesis topic. To help work through some thesis ideas, I created three topic sentences that would put forward my initial reflections.
November 14, 2011 The digital environment is dependent on trust between users and data, yet the sources we trust do not provide any evidence to verify its credibility, making users continually misinformed and overwhelmed.
data convenient web services user-contributed data value
Users influence improve web services encouragement vocabulary developers digital
Finding the Right Words to Focus on Overall the topic sentences were too wordy. Still, there were certain keywords that would go onto influence my thesis research.
trust sources evidence credibility informed
Feedback from an Important Audience After presenting my topic sentences in class, I received an overwhelming response from my classmates. Their enthusiasm and recommendations for my topic inspired me to continue refining my thesis explorations.
Writing a Thesis Statement At this stage, my thesis statement was beginning to formulate. Based on my classmates feedback I observed that designers are enthusiastic about contributing to the web but lack the confidence to do so. Ultimately I wanted my thesis to establish value in a digital environment through collaboration. It was also important to create awareness and a point of access for users to digest the internet (referring to my initial inspiration from my parents).
Thesis Statement Dis/Reconnect: Building a Collaborative Web Experience December 5, 2011
The Internet has been around for less than fifty years. In that time it has managed to flourish and produce a majority of the modern technologies we are familiar with today. Still, people are continually disenchanted with the web and its resources. A significant population of web users are unable to navigate and digest the Internet. Every generation approaches the Internet in different ways. Give a child an iPad and before you know it theyâ€™ve hacked into your iTunes account and downloaded a variety of Angry Bird apps you didnâ€™t even know existed. On the other hand, have you ever seen your parents or grandparents try to browse the web? Itâ€™s a nightmare. The problem with technology today is the failure to educate the wide range of generations who interact with the web. I believe there must be a better way to connect people with the knowledge required to pioneer their own digital experiences. A collaborative initiative is necessary to encourage developers and users to communicate with one another. Designers can bridge the gap between users and web services by devising ways to translate the demands of each group. The power of web platforms lies in the hands of its users. If users are unhappy with their web experiences, the success of the web platform suffers. Therefore, users need to start calling the shots on the web and telling developers what they want.
Creating a Visual Thesis Statement In order to augment my written thesis statement, I began the process of adapting the text into a visual booklet. This booklet would concentrate on the topics expressed in my thesis statement as well as provide any visual evidence to supplement the text.
The civilization of the past hundred years, with its startling industrial changes, has tended more and more to
make life insecure. We can never insure one hundred percent of the population against one hundred percent of the
hazards and vicissitudes of life, but we have tried to give some measure of protection to the average citizen
Adapted from Franklin Delano Roosevelt, 1935
The web is more a social creation than a technical one. I designed it for a social effect â€” to help people work together and not as a technical toy. The ultimate goal of the Web is to support and improve our weblike existence in the world.
-Tim Berners-Lee, 2000
EVERYTHING IS AMAZING AND NOBODY KNOWS WHAT THEY ARE DOING.
The Internet has been around for less than fifty years. In that time it has managed to flourish and produce a majority of the modern technologies we are familiar with today. Still, people are continually disenchanted with the web and its resources. A significant population of web users are unable to navigate and digest the Internet.
[Definition] How the Internet works
THE GENERATION GAP (WHERE TECHNOLOGY FAILS)
[Definition] Percentage of Internet Users, by Generation 90 80 70 60 50 40 30 20 10 0 Millennials (18-33)
Gen X (34-35)
Young Boomers (45-55)
Older Boomers (55-64)
Silent Generation (65-73)
G.I. Generation (74+)
Every generation approaches the Internet in different ways. Give a child an iPad and before you know it they’ve hacked into your iTunes account and downloaded a variety of Angry Bird apps you didn’t even know existed. On the other hand, have you ever seen your parents or grandparents try to browse the web? It’s a nightmare. They click on everything (usually all at once) and soon they’re calling you to restart the computer because “I can’t see the arrow anymore.” Young adults fall somewhere in-between. We’re not as comfortable with the Internet as younger generations but we are able to provide support for older generations. The problem with technology today is the failure to educate the wide range of generations who interact with the web. I believe there must be a better way to connect people with the knowledge required to pioneer their own digital experiences.
AM I USING TECHNOLOGY, OR IS IT USING ME?
The way the Internetâ€™s websites and apps are created is counter intuitive. Developers work with other developers. Technology is used to create more technology. Everyone forgets to talk to the user. But technology is for humans, not for computers. People have the influence to improve web services, but they lack the encouragement to do so. The Internet is dependent on the contributions of its users. Facebook doesnâ€™t work without your profiles, Twitter needs your tweets, and Google is looking for your searches. The power of web platforms lies in the hands of its users. If users are unhappy with their web experiences, the success of the web platform suffers. Therefore, users need to start calling the shots on the web and telling developers what they want.
THE START OF SOMETHING GREAT According to published reports, 78% of adults use the Internet. What will it take for the remaining 22% to get online? In order to persuade people to interact with technology it is necessary to provide an introductory education to comfort users. Innovations in technology take a long time to mature. It took 30 years for electricity to truly transform people’s everyday lives. We are in the early phases of integrating the web into our culture. It’s important to acknowledge the wide potential the Internet has yet to offer. It’s never too late! We still have the opportunity to redefine the web into a uniquely personal experience.
HOW DESIGN AND COMMUNICATION CAN HELP
A collaborative initiative is necessary to encourage developers and users to communicate with one another. Designers can bridge the gap between users and web services by devising ways to translate the demands of each group. History illustrates that designers are always ready to play mediator between users and innovations. Austrian educator Otto Neurath and German illustrator Gerd Arntz created the International System of Typographic Picture Education (or Isotype) after World War I to transform complex information into self-explanatory illustrations for the universal public. Like Neurath and Arntz, designers need to aid the public to universally understand the complex language of the Internet.
A CALL TO ACTION An ideal digital environment is comfortable for all users regardless of age. Technology creates technology. Developers and users need to speak to one another to fix this broken system. Designers can facilitate the discussion between each group. Together, a standard to aid in the navigation of the web can be achieved. The time to restructure the web is now and itâ€™s up to the users to speak out. TECHNOLOGY IS FOR HUMANS, NOT ROBOTS.
“The internet wants to hire you to build stuff for it because its trying to figure out what it can do. It’s offering you a blank check and asking you to come up with something fascinating and useful that it can embrace en masse, to the benefit of everyone.” Ben Pieratt, Creator of Svpply 2011
What Should I Do Next? When Finally, a Breakthrough. Before I began the action phase of my thesis, I read an article by graphic designer Ben Pieratt titled Dear Graphic and Web Designers, please understand that there are greater opportunities available to you. Pierattâ€™s concise request for designers to embrace the web resonated with me. Now I embarked on a mission to create independent and original websites for the sole purpose of engaging others.
“This was our first computer and it was the greatest thing ever. I was so hooked.” –@la_bitessa
Everyone develops a real attachment to technology. Do you remember the first interaction you had with digital media? I can remember learning how to type in the 4th grade using an old Windows 98 desktop.
In order to tap into this tangible nostalgia, I created a site titled My First Computer. The site encourages users to submit photos of their first computer. The results were heartwarming â€“ it was nice to see how technology has delighted us all. myfirstcomputer.tumblr.com
â€œMe, on first grade, playing a maths game. This must have been around 1987.â€? Submitted: March 27th, 2012
“Morgan and I playing some game on our first Mac. An LCII I think. Shortly after this picture was taken, I started trashing stuff in the system folder because I thought the empty trash sound was cool. My dad loved reloading the OS the first day he setup the machine.” Submitted: January 30th, 2012
“In case you were unsure…” Submitted: April 20th, 2012
Tweet by Maria Popova of Brain Pickings
Facebook status by Etsy asking users about their first computer experiences
There was an Enthusiastic Response The My First Computer tumblr struck a chord with many people. It was shared multiple times, allowing a digital audience to recount their first computer experiences.
A selection of the followers and reblogs on Tumblr
And Still No One Knows What Theyâ€™re Doing In addition to love, technology has the ability to incite hate. Do you remember the last time technology frustrated you? Iâ€™m frustrated every time I receive an email with an all-caps subject, multiple times.
Making Everyone Frustrated and No One Happy To illustrate peopleâ€™s frustrations with technology, I developed a site titled Everything is Amazing and No One is Happy. The site automatically collects tweets from individuals announcing their hate for technology. The site design is purposely broken to further demonstrate how temperamental technology can be. lyannedubon.com/projects/thesis/unhappy
frustrated and tired. I hate technology. ITâ€™S SUPPOSED TO WORK FOR ME NOT AGAINST ME!!!! 1:38 AM - 17 April 2012 via iPhone
hate technology.. all i want is music on my ipod.. please sync :( why is it so hard :â€™( #actuallycrying 3:54 PM - 18 April 2012 via web
Gratuitous Technology Nothing frustrates me more than seeing pointless technology that intimidates others. One example of gratuitous technology is the QR code. The QR code is a scannable image that directs you to a website with more information about the item you are viewing. It heralds itself as the â€œnew hyperlinkâ€?. The QR code is the solution to a problem that does not exist. No one had trouble with old hyperlinks, why pollute technology with redundancy?
Proving a Point In order to illustrate how ridiculous QR codes are, I created a web-app that allows a user to stick a QR code on any image they desire. Itâ€™s easy to see how the QR code can ruin beautiful masterpieces like The Mona Lisa just for the sake of trends. lyannedubon.com/projects/thesis/QR
Sen. Leahy (right) and Rep. Smith (left) were the main proponents of the bill January 17, 2012 via Politico.com
Protestors against SOPA and PIPA took to the streets in New York City. January 18, 2012 via Wired.com
Digital Advocacy My thesis explorations coincided with the height of the Stop Online Piracy Act (SOPA) controversy. While there were many active protests and important messages being broadcast, I was still unsure of the true facts behind SOPA. I researched many sites to learn more about the legislation but realized there was no central straightforward space to learn about the proposed changes.
Direct Answers As a result, I built a simple site that answered frequently asked questions about SOPA in plain-spoken language. Additionally the site has an index of sources to learn more about SOPA. Most importantly, users can submit their own questions about SOPA to receive a credible and direct answer. lyannedubon.com/projects/thesis/SOPA
Spreading the Word THIS PAGE Tote bag that motivates people to create a website with the given text
In addition to digital explorations, I created some physical memorabilia to get others excited about my thesis.
SHOWN HERE Personalized buttons that list an individualâ€™s Google Search rank number
The purpose of art is to inform and delight -Milton Glaser, Graphic Designer
Wise Words from a Legend Sparks an Idea I wanted to share my research and explorations with designers and developers in order to motivate each group to recognize the need for collaboration on the web. Luckily I didnâ€™t have to look very far to find inspiration on how to achieve this collaboration.
The purpose of a website is to inform and delight -Lyanne Dubon, Graphic Designer
Making the Case for a Better Web As mentioned in my thesis statement, the only way to create a better digital environment is through collaboration. This way, designers and developers can come together to make the internet an engaging place.
Why? To illustrate the need for collaboration, I surveyed the current state of sites I use across the web.
Why Now? Now is the perfect time for developers and designers to collaborate. Thereâ€™s a variety of resources including collaborative spaces, digital resources, and accessible software available for each group to familiarize themselves with the otherâ€™s craft.
A List Apart
New Radicals Existing models of design/developer relationships reinforce and influence the call for collaboration. The websites created by these collaborations far exceeds what currently exists on the web. They are both interactive and design conscious. It comes as no surprise that the final products are stunning. SHOWN HERE MTA.me website created by programmer/designer Alexander Chen. Alex used HTML5 and Massimo Vignelliâ€™s famous subway map to turn NYCâ€™s mass transit system into a playable musical instrument.
Typophile – Typography Advice
Food.com – Recipes
Apple.com – Tech Support
Helping People Help Each Other I also explored existing models of collaboration. Currently a variety of forms exists where users can congregate to receive digital encouragement. One such example is the typography forum Typophile. Users of any skill level can seek support from other typography enthusiasts by posting to the open forum. Below is a selection of sites where collaboration and promotion occur: Sites that Offer Inspiration siteinspire.net ffffound.com dribble.com thingstolookat.com bench.li creativity-online.com designenvy.aiga.org septemberindustry.co.uk core77.com funislearning.com Sites that Promote Work swiss-miss.com thinkingforaliving.com thingstolookat.com behance.net notcot.org itsnicethat.com creativereview.co.uk Sites that Inform designobserver.com fastcodesign.com underconsideration.com the99percent.com exp.lore.com brainpickings.org imprint.printmag.com dezeen.com
Community Experiences As another way to research the power of collaboration, I looked at community experiences. One successful community experience is Under Considerationâ€™s Brand New Conference. This conference unites various disciplines of design to meet and focus on the practice of corporate and brand identity â€” a direct extension of the popular blog, which exhibits and archives case studies and commentary on identity work.
1. Create a digital community 2. Organize Group Discussions and Workshops 3. Document Designer/Developer Experiences
Time for a Plan Based on the evidence presented, I came to the conclusion that now was the time to collect all the available resources to foster collaboration between designers and developers. I came up with a three-step plan to execute the necessary resources to encourage designers and developers to collaborate.
Reactions to My Initial Plan After presenting my case for collaboration to the class, the feedback once again was extremely helpful and enthusiastic. Written feedback also provided some key points that I would later go onto concentrate on in the execution of my thesis plan.
Brainstorming a Strategy and then Working Backwards After developing my initial plan, I started on a strategy to make each step of the plan possible. My initial plan included three phases: web, people and events. The idea was to mobilize on each front with a digital outreach, individual influences and events to support collaboration. While I was focused on creating a strategy it became apparent that I was missing an omnipresent voice that connected each network. It was a textbook example of not seeing the forest for the trees. Successful resources need more than a good concept, they need a name and an identity which connects with people.
Creating a Name It was important for the brand to be focused enough to speak to audiences about digital needs but broad enough to include a variety of forms. I brainstormed a couple of names, until I finally settled on ‘Voracious’ (unintentionally and humorously misspelled on the left). Voracious appealed to me because it spoke to the way in which digital media is consumed today. We read voraciously, we learn voraciously, and we move on voraciously. I also liked the happy coincidence that the word ‘us’ existed within Voracious.
First Sketches With a name in place, I started the first design drafts for the logo. These sketches illustrate some initial design directions I wanted for the logo. I was interested in creating a typographic logo that highlighted the us in Voracious.
Custom Voracious Letterforms
Welcome to the Voracio.us ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 ~!@#$%^&*() Georgia Italic – Supporting Typeface
The Voracio.us is a network for collaboration ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 ~!@#$%^&*() Helvetica Neue Medium – Supporting Typeface
The final identity illustrates the varying amounts of voraciousness. Each letterform moves in-between levels of richness to coincide with a personalized degree of Voracio.us use.
What is MySQL, PHP, and ASP?
How do I build a website?
What Kern Mean
t does ning n?
Twitter Tumblr TOP LEVEL NAV
Overview of Sections
List of Resources
Digital Services (w/ Reviews)
Shortcuts and Keywords Code Process
After finalizing a brand look and feel, I began to draft what a digital network would look like for the Voracio.us.
Contact Info ABOUT Mission Statement
Call for Apps
Expert Forum Discussions
FOOTER Copyright Software
featured section item title
slide/scroll to nav item title forum discussions
index of categories
start a topic
index of categories
index of categories
how-to article provider review
tutorial title how-to article provider review
item title tutorial title
index of categories
submit an item
Initial website wireframes for a complete Voracio.us directory.
se Iâ€™m looking for...
I Love Typography
The Design Encyclopedia
Walker Art Center Design Blog
Design Matters Archive
Design Student Resource
The Society Of Publication Designers
The Type Directors Club
Helvetica the Film
Typeface the Film
Friends Of Type
Imprint (Print Magazine)
We Love Typography
WEB AND MOTION DESIGN
The Creative League
Art of the Title
Create Digital Motion
Favourite Website Awards
Web Style Guide
A List Apart
sign You Trust
Many Eyes By Ibm
ings To Look At
Small Design Firm
Web Design Ledger
Site Inspire Voracio.us Thesis
su Lyanne Dubon (ldubon)
Member since April 2012
FORUM QUICK VIEW
Post a New Topic
Pos Restore broken links? LAST POSTER: TECHILL
Hou Float not working in IE? LAST POSTER: SOBUDDY
How to embed Twitter on my website? LAST POSTER: GLENNAMJENKINS
Code Removed - Now Site isn't working! LAST POSTER: CLAYTONJAMES
Can't view images on subdomains. LAST POSTER: PAALJOACHIM
LAST POSTER: THREESTYLER
Background image map?
BY: GLOBAL REPORTER
LAST POSTER: ALCHYMYTH
date Account Information
Y SAVED LINKS
MY SAVED TUTORIALS
What is a CMS?
What is an API?
What is PHP?
What is a CMS?
What is PHP?
What is MySQL?
sign You Trust
My parents for inspiring me to give them a digital solution for the web. Joe Marianek for being an amazing advisor and collaborator. Mondayâ€™s portfolio class for their constant enthusiasm and feedback. School of Visual Arts for providing an open studio space when necessary. Everyone who helped in any big or small way.
Voracio.us is a universal network of online and material resources for designers, developers, and web participants looking to expand their k...