In the course of her career working solo, in a duo, with agencies, with corporations, and with a startup, Meagan's learned a few valuable lessons (some the hard way) about how to grow as a designer. She'll talk about how she got started, as well as insights on collaborating, evolving your style, and getting things launched. You'll also hear about the design maxims she holds dear (and which ones she ignores), and the web development techniques that have strengthened her design skills. She hopes to leave you with some ideas for how to be a web design champion.
4. Chartbeat Highlight
• Lots of visibility
• Fun, shareable, quirky
• Clean, simple, and on brand
• Works on multiple devices
5. “The only thing standing between
us and our Olympic dreams are that
we’re out-of-shape, apathetic, and
incapable of passing a drug test.”
6. Achieve
your design
dreams
• How to get started and
where to work.
• How to overcome common
project hurdles.
• What skills are important for
a web designer.
• How to better collaborate
and get things launched.
8. Common questions
• Should I study web design at school?
• Should I go back to school?
• What should I read?
• How do I get a job?
• Where do I get ideas?
9. designers & degrees
Jeffrey zeldman Ethan Marcotte Dan Cederholm
fiction writing english literature music recording
Kyle steed Aaron draplin Yours truly
dropout dropout dropout
10. “One of the best pieces of advice I can
give to a designer is to be well-traveled.
Design is really about people; the more
you understand humans, the better you
will be as a designer.”
- Yaron Schoen, design lead at Twitter NY
11. start with a good book
Head First Don’t Make Designing with Bulletproof
XHTML & CSS Me Think Web Standards Web Design
A Book Apart Series + 5 Simple Steps Series
12. start with a good book
Posters for the Grid Systems The Elements Books about
People: Art of in Graphic of Typographic designers in
the WPA Design Style other fields
13. Just make things
• Do band sites and “business” sites
• Make terrible blogs
• Do silly online tutorials
• Be careful about free work
14. a first,
t
Steal
like a
fiend
• Don’t sell or publish your
work.
• Write and talk about
lessons learned.
• Don’t be an asshole.
Credit the original artist.
17. Go corporate
• Learn the basics about process, what not to do
• Get introduced to the community
• Be forced to use weird frameworks
• Learn about office politics
• Work with people from various fields
18. Working at
an agency
• Full of better designers
• Work on a variety of projects
• Learn about process
• Leave when you aren’t
challenged
19. Going solo
• Everyone should do this
• Network with developers
• Learn more and faster than ever
• Stretch your skills in every direction
• Stop when you get burn out
20. work at a Startup
• The thrill of a risk
• Work with a small team of
people you love
• Have creative control and stake
• Rapidly broaden your skills
• No HR department!
22. Meet Tony
• CEO, British, loves puns
• Keeps a chaotic group of
immature but brilliant
people on track
• Looks for specific qualities
when hiring
23. Be “T” shaped
Interests • Is it better to be an expert, or
good at lots of things?
• The answer is “both”
• Have a deep specialty in a field,
Specialty but a broad range of other
interests
24. Chartbea t-shapes
t
Tom Germeau Yours truly Matt Bango
Product Design Marketing Design Product Design
• Front-End Dev • Front-End Dev • Front-End Dev
• Mobile Design • Illustration • Typography
• Ukelele • Writing • Photography
• Batman Comics • Owls • Birding
• Being Belgian • Cider • Gin & Tonics
• Rhubarb • Pokemon • Katy Perry
25. Design for
different
mediums
• Keeps you from
getting bored
• Forces you to hone
your instincts about a
specific aspect of
design.
29. make an
interactive
wireframe
• Show clients :hover
behavior, animations
and transitions
• Make quick edits to CSS
for changes
• Sets the groundwork for
the site’s markup
43. The answer: it depends
• Coding has made me a more efficient,
more well-rounded designer.
• You’ll better understand the medium
you’re designing for.
• Collaboration is easier.
• Either way, keep developers in the loop.
46. Dieter Rams’
10 principles
for good design
1. Good design is innovative
2. Good design makes a
product useful
3. Good design is aesthetic
4. Good design makes a
product understandable
5. Good design is
unobtrusive
47. Dieter Rams’
10 principles
for good design
6. Good design is honest
7. Good design is long-lasting
8. Good design is thorough
down to the last detail
9. Good design is
environmentally-friendly
10.Good design is as little
design as possible
48. 10 principles for good design
Read them and see more work:
vitsoe.com/gb/
about/good-design
49. Why have principles?
• Helps to clarify your mission
• Helps to frame your feedback
• Helps us defend our designs
• Have amazing conversations about design
50. Writing
your
principles
• Make them specific to your team.
What are your weaknesses?
• Clarify your most important goals
• Challenge everything, don’t just
state the obvious
• Steal from other designers and
competitors
• Share them with everyone
51. "To design is much more than simply to
assemble, to order, or even to edit; it is to add
value and meaning, to illuminate, to simplify, to
clarify, to modify, to dignify, to dramatize, to
persuade, and perhaps even to amuse."
- Paul Rand
52. Chartbea t’s
10 principles
for good design
1. Use as little design as possible
2. Be delightful
3. Data drives the design
4. Make it fast
5. Be modular and consistent
53. Chartbea t’s
10 principles
for good design
6. Challenge dogma
7. Keep it dynamic
8. Be empathetic
9. Build in forgiveness
10. Be evaluative
55. Getting
feedback
• Encourage discussion rather
than email feedback
• Bring in people who are new
to the project
• Talk to team members with
different specialties
• Back up your decisions
56. When to get feedback?
• Designers tend to want pixel-
perfection before sharing
designs
• Get input early and often,
include stakeholders and
developers
58. giving feedback
• Be less concerned with style than empathy.
• Is the right content emphasized?
• What detail work is left undone?
• Are elements designed for the sake of decoration?
• Giving feedback makes you more self-critical.
59. Working
with other
designers
• Bango is Mr. “50
Shades of Gray”
• Meagan is Ms. “80
layers of textures +
technicolor explosion”
• Each style plays a
valuable role
60.
61.
62.
63. Working with
other designers
• Temper one another’s tendency to
rely on the same old tricks
• Challenge and be challenged
• Don’t work somewhere if your styles
are utterly in conflict and you’re not
learning
65. Why hack?
• Go out on a limb, try something new.
• Break your process, refine it.
• Collaborate with new people.
• Fix a problem that’s bothering you.
66. Chartbea .com/labs
t
Big board Universe Sidebar widget Data mosaic
Traffic Visitor map Real-time chess About page
67. Meet Vadim
• Back-end engineer,
Russian, creative drug user
• Sends angry emails
• Helped me redesign the
about page
68.
69.
70. big board in the wild
Al Jazeera CNN MOney Glenn Beck
NBC Wall street journal IGN
- Hi, thank you so much for having me and coming out to hear me speak.\n- I’m Meagan Fisher, known on the internet as Owltastic. I’m the Art Director at a startup called Chartbeat.\n- Today I’m going to talk about [title]. It’s a corny title\n- Basically how to get better, some lessons learned along the way\n
- Project called chartbeat highlight\n- Watching the Olympics, particularly men’s swimming events\n
- CHartbeat: Real-time analytics; what’s happening on your site now in the simplest, most actionable way possible.\n
Considerations for Highlight\n- Very public feature, something lots of people would see\n- Needs to be quirky, have personality, can’t be too far from product\n- Working closely with a developer building out javascript, tying in with our API\n- Lots of rounds of feedback, many people invested\n- When these challenges were overwhelming I’d go watch the Olympics in a bar with my friends\n
This graphic sums up my feelings while watching the Olympics. These people trained incredibly hard for years, had amazing endurance and determination.\n
Even if we can’t be Olympic athletes, we can still be champions in our field. I’ll discuss some of the ways I’ve tried to do that, the things I’ve done that have made me better along the way.\n
Touch a little bit on the concerns of newbies; a few of the common questions I get from people just starting out, or thinking of moving from Graphic design to web design.\n
Here are some of those questions: people want to know if they need to study design at school, what resources to turn to, where to work to get their career going, and where to get ideas.\n
Here’s a selection of some of my favorite designers, myself included, who have no formal design education at all. \n\nObviously there are lots of great designers who did study design in college, but it’s not a prerequisite by any means. \n\nIn fact, I would argue studying other fields can sometimes make you a better designer than you would’ve been if you’d gone to school for it.\n
This is a quote by Yaron Schoen, who is the design lead at Twitter here in New York. I think it sums up what we should be focusing on early in our careers, which is less about technical skill and more about exposing yourself to different types of people, and trying to understand the challenges they face on the web.\n
As far as acquiring technical knowledge, all you really need is a great book. Here are the first four books I read when I first started learning how to build websites, I’ve also included the more recently published Book Apart series, as well as 5 simple steps. These are really comprehensive in getting you up to speed with the challenges in web design now.\n
Don’t limit your education to technical books, make sure you also read some Art History and graphic design principle books. Don’t worry about reading whatever’s in the “cannon”, focus instead on what interests you. I love the works of the WPA in the 30\n‘s, so I have an inspiration book about that which I regularly turn to when I’m stuck.\n
The best thing you can do is start making things. I designed a series of ridiculous Tumblr’s for my friends, as well as a site for a band and a magician. These projects were fun and low-risk, and they helped me build a portfolio so I could get a job. One other note; don’t let people take advantage of your inexperience when you start out. You can work for free if there’s a project you really want to do for a friend, but if a company is profiting from your work you should expect to be paid.\n
It’s okay to steal when you’re first starting out, as long as you never publish this work under your own name. You can blog about what you learned from the experience of mimicking other’s style, as long as you clearly credit the original artist.\n
Be sure to gather inspiration from multiple industries, not just web designers you admire. When I’m stuck I don’t just look at what my favorite web designers are doing; I look at photography blogs or go to a museum. This will ensure your work isn’t too heavily influenced by one person.\n
I’ve worked in a lot of job environments over the last 8 years or so, and I want to quickly touch on what I learned from each of them, and how I decided when to leave a company.\n
- First job was a large corporation, called Dynetech\n- Started as an intern, eventually became a full time designer. Usually looking for cheap labor.\n- Lots of obvious disadvantages: bureaucracy, office politics\n- Work with people from different backgroudns\n- Forced to use Visual Studio .net, once you do that everything else is a treat\n- Don’t spend your life in a corporation if you want to continue to grow creatively\n
- Most people at agencies are better than you, you learn so much\n- Crank out all kinds of projects very quickly\n- The agencies I work with have very segmented roles; designers work in photoshop, developers build markup, etc. It’s efficient, but I wanted to be able to focus on a variety of things; project management, code, and design.\n
- I spent the majority of my career doing solo work, which I think every designer should do\n- Challenges you more than any other role\n- Forced to work remotely and learn how to handle those challenges\n- Learn about project management, the business of design\n- It’s fun working in your pajamas, but eventually you’ll get burnt out\n
- Now I work at a startup, and I love it\n- Small team of people working very closely together\n- Very invested in your work if you have stake in your company\n- Chartbeat has no HR department so we can drink and curse at work\n
- Jack of all trades, or master of one skill?\n
- This is the CEO of Chartbeat, Tony\n- He asks people what they’re interested in, and he’s looking for a specific type of answer\n
- Tony talks a lot about being “T” shaped\n- Have one deep specialty, but be curious about many things\n\n
- Chartbeat designers\n- One focuses on Mobile Design\n- \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
German industrial designer\nBelieved in purposeful designs\nPushed for sustainable designs too\n
Came up with a set of principles to determine if a design was good or not\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
- CHartbeat: Real-time analytics; what’s happening on your site now in the simplest, most actionable way possible.\n