We will be closed April 25-28.

Design Action is moving down the street so we will be closed April 25-28 as we move our office to:
1730 Franklin Street, Suite 103
Oakland, CA 94612

Stay tuned for open house information!

Posted in Events & Updates, News, News

The Importance of Design for Your Copy Writing Weds. Presentation

1. Before and After – from plain text to a designed piece

2. This layout shows many design elements that a writer can consider when writing. What pieces of information are important for the skimmer to take away from the piece? The use of pullquotes, text boxes and data visualization helps to break up the text and enhance the important information in the report.

 

3. A concept or metaphor goes a long way and really intersects the written content with the visual imagery and typography, design and layout choices for the piece.

4. A large infographic piece created for online reading. The writer and designer had to work closely together to realize the concept and metaphors used, as well as making sure that the key data elements are elucidated.

5. A short illustration which highlights some key points of information, that was shared on social media.

6. Consider where the audience will be reading the content. In this case, this poster was on a BART (commuter) train, where the audience is captive and looking for something to read. So more text could be incorporated into this poster.

7. Who is the audience? These pages are from a heavily designed report which was geared to students to take action around computer and high tech recycling.

8. The audience for this report is concerned about policy change, so the design is clean and serious, and clearly communicates the content, while still using some elegant design elements to humanize the design.

9. How do we consider a piece, such as this newsletter from a POWER, a grassroots economic justice organization, that needs to speak to a diverse audience, made up of youth, elders, English and Spanish speakers, working class and low-income people, as well as funders and donors, without losing the essence of the organization’s mission? The use of color, bold headings, text blocks, and photography, as well as equally balanced layouts in both languages, speak to a wide range of stakeholders.

10. Some tensions between writers and designers: the use of white space. This example shows what happens when the writer wants to fill up all the space with text. It looks a bit daunting.

11. White space, or negative space, is a just as crucial a design consideration as what is placed on the page. It gives balance to the piece, increases legibility and enhances the reader’s experience.

12. Even though writers and designers have this tension about when to cut copy, there are ways to be able to incorporate more text into a piece. Some design gets compromised, but through the use of design tools such as color, typography, and design elements, these are still visually pleasing pieces.

13. This one-pager is heavy on text, but with some strategic design elements and use of custom icons, the piece is a visually exciting tool for the campaign.

14. A small trifold brochure using some basic design tools: use of color is not overloaded but kept to the color photographs and strategically used throughout the piece. A good use of leading, the space between the lines, breaks up the text while also drawing it out on the inside left panel. Bullet points and quotes also make this a digestable piece for the reader to understand what the project is doing.

Some links I have found useful:

http://vandelaydesign.com/blog/blogging/editing-goofs/

http://www.vanseodesign.com/web-design/communication-design-writing/

http://www.smashingmagazine.com/category/graphics/

http://indesignsecrets.com/

Posted in Uncategorized

The Loving Tension Between Writers and Designers

How many time has a copywriter bemoaned that designers always say there’s too much text? How many time does the designer  want the editor to cut more text?

How can we come to a perfect harmony?

Graphic design should make your text sing. Good design should enhance the text—it is the supporting actor to the lead star, making sure that the lead role drives the plot and the story. It is the rhythm section to the leader singer. It is the choir to the diva. At the same time, if the story is dominated by the one star always taking the solo, the audience can lose interest—it starts to feel monotonous. This is why design can enhance the copy.

Functional graphic design shouldn’t overwhelm the reader to distraction but encourage the reader to read the this brochure, report, flyer, advertisement. Graphic design should show off the stars of the story.

Graphic design can transform your copy into an eye-catching piece:

And give it a level of sophistication:

How does graphic design interact with your copy?

Color: Less is more when it comes to color. A good color palette will enhance and not distract. We want it to be easy for the reader to read the text. Accent colors can pop out key points.

Why White (or negative) space is important: It’s tempting to use all that extra space up to the edge of the page so we can keep all the important copy. But here is why it’s not a good idea (compare to above):

White space allows the eye to rest. It increases legibility. It increases attention span. It allows a level of sophistication. It creates breathing room and balance. The eye and the brain feel at ease.

What the heck is leading? Simply, the space between the lines of text. How much space depends on the context of the piece. With dense reports, newspapers, and articles, increasing leading will aid in legibility. For design purposes, imagine a beautiful quote with a beautiful font allowed to shine on a page of an annual report.

Typography and Text Styling: Designers use typography to enhance text, to evoke a feeling, or that is easily read on a page. Fonts for text, headings, and special treatments, are carefully chosen from a wealth of fonts available. Using the different fonts in a family (bold, italics) helps enunciate key text. The use of different typefaces should complement each other, based on many factors, as well as support the tone of the publication.

Write with design in mind

What do you want to stand out in the article? Whose story can we bring attention to? These little cues can help the designer bring attention to a specific content that needs to stand out. What do you want the skimmer of the report to take away? Text boxes, pullquotes and captions to the compelling images will be what attracts that skimmer to read.

Where will this piece be read, on a commuter train where you have the readers attention to read through the entire ad, or in a short-attention span, info-overloaded space like an exhibit hall at a conference? These considerations will allow the designer to know how to design the pages, lay out the copy and style the text.

Overall good graphic design is meant to support and enhance the main messages of the content and make the copy accessible and pleasing to read.

“The dumbest mistake is viewing design as something you do at the end of the process to ‘tidy up’ the mess, as opposed to understanding it’s a ‘day one’ issue and part of everything.” ― Tom Peterson

NOTE: Design Action will be presenting with Writing to Make A Difference on a FREE conference call for Writing Wednesdays, March 5 at noon Pacific.

Posted in Case Studies, Design Styles & Samples, Events & Updates, News

2013 Year in Review

DAC.YIR2013.42013 was a landmark year for Design Action Collective. We celebrated our 10 year anniversary and strengthened our relationships with organizations working for social change. Here are some highlights:

10 Years of Designing for Change

To mark our 10 year anniversary, we did a retrospective show at the SoleSpace gallery in Downtown Oakland on March 8. Because our show opened on International Women’s Day, we released a new poster at the event titled “Speak Out Against Gender Violence.”

womensdayposter

Our goal for this show was not simply to showcase the huge body of work that has come out of Design Action over the years, but to celebrate the organizers and activists we’ve had the honor of working with on successful campaigns and ongoing struggles.

Check out our Video Retrospective.

We all had a great time dancing the night away!

party

 Check out the article in Oakland Local by Bonnie Chan.

A Year Full of new Logos, Websites, and Infographics

We are proud to have launched 36 new websites, designed new logos for 40 organizations, and flooded social media with timely campaign graphics. Here are a few…

 up khmer

flic

kaporcenter

Social Media Graphics

socialmedia

Info Graphics

We have sharpened our skills in the art of data visualization and created several infographics this year.

infographic

 

Design Action Out and About

In addition to sitting at our computers building websites and designing campaign materials, Design Action members were out in the streets and organizing with our diverse communities around issues or gender justice, workers rights, and immigrant rights.

In March of 2013, Josh Warren-White attended the World Social Forum in Tunisia as a photographer for the Grassroots Global Justice delegation representing social movements across the United States, including delegates from many of our client organizations such as Causa Justa/Just Cause (CJJC), Asian Pacific Environmental Netwrok (APEN), Labor/Community Strategy Center, Indigenous Environmental Network (IEN), Miami Workers Center (MWC), Southwest Workers Union (SWU), and many more. It was a powerful experience to be in the birthplace of the Arab Spring building solidarity with leaders from the front lines of social movements around the world. Below is a collection of photographs from the delegation. You can read the full reportback from the US delegation here.

sarah and poonamPoonam Whabi and Sarah Reilly are part of the Brass Liberation Orchestra (BLO).  They brought up the precussion section this year as BLO played energetic music at the May Day March for Immigrant Rights, the climate justice rally at the Richmond Chevron Refinery, and  rallies supporting BART’s striking workers to name a few.

Nadia Khastagir has been working with San Francisco Women Against Rape (SFWAR) for many years — designing the logo and outreach materials for the organization. Nadia is now on the board for SFWAR and helped put on a successful event this year honoring the organization’s 40th anniversary.

Andrea Salazar and Ria have participated in several local hackathons developing empowering tech tools. Ria participated in Trans*H4CK, the first-ever hackathon focused on bringing together trans and gender non-conforming tech workers to create projects that advance social justice. The tool Ria’s team created, Trans Resource US,  won Trans*H4CK.

A is for Activist, the ABC book for the 99% that Inno wrote and produced originally as a Design Action project, turned out to be a hit. It won the Horace Mann Upstanders New Talent Award, and sold out by mid year. Since then it has been picked up by Seven Stories Press and is already going into a second printing with them. AND a Spanish adaptation by the Grammy Award winning lead singer or Quetzal, Martha Gonzalez, is coming soon!

Design Action members gave presentations on communications for grassroots activism and participated in panel discussions on worker coops at several conferences and events this year including Allied Media Conference, The Western Worker Coop Conference, and the Aspiration Tech Nonprofit Software Development Summit.

We are grateful to our community for helping us to stay accountable to the changing, evolving needs of the movement. We look forward to more collaborations in 2014!

 

 

 

 

Posted in Case Studies, Events & Updates, News, News

Join the Conversation with Center for Story-Based Strategy, Design Action and New Tactics

This week, October 14-18, Design Action is participating in an online conversation, Change the Story: Harnessing the power of narrative for social change at New Tactics in Human Rights.

This conversation is led by Center for Story-Based Strategy to dig deeper with activists around the world into using stories to organize, change the dominant narrative and develop strategies into campaign planning.

Posted in Messaging and Strategy, News, News

Design Action Represented at First Trans* Hackathon: Trans*H4CK

This past weekend, Design Action sent one of our team to Trans*H4CK, the first-ever hackathon focused on bringing together trans* and gender non-conforming tech workers to create projects that advance social justice for the trans*/GNC community.

A bit of background: a hackathon is an event—often a (friendly) competition—where a group of people come together for a short duration of time and use coding, programming, and design to create technology around a central theme. Trans*H4CK is the project of Dr. Kortney Ryan Ziegler, a local transgender advocate, and was created to address the significant challenges facing trans* people, especially access to healthcare, safe housing, and employment. The Trans*H4CK website (transhack.org) succinctly sums up the purpose of this hackathon: “A necessary step in addressing anti-transgender bias is to create technology that socially empowers transgender individuals.”

Design Action was represented at Trans*H4CK by Ria, our newest member. About forty people participated in the hackathon, divided into several competing teams. Ria’s team chose to create a resource where trans*/GNC individuals could enter their zip code and find local trans-friendly resources within a variety of categories.

The Trans*Resource US homescreen

Ria was part of Trans*Resource US’s front-end development team, where she designed the website skin and coded the page in HTML5/CSS3.

This project—which became Trans*Resource US over the weekend—worked as a responsive website, fully optimized for both desktop viewing and mobile browsing. The team had a strong commitment to accessibility, and early on chose to not only make sure the site was usable on a range of devices (including screen readers for the visually impaired), but could also be used by people without access to computers or smartphones. Thus, the project also incorporates an SMS based service, TranSMS, where people can send a text message with their zip code to 617-433-TRNS (8767) to receive local resources.

A number of inspiring projects came from the other teams, including a clothing exchange service between transmasculine and transfeminine individuals, a legal resource guide for healthcare access, and a micro-survey platform called Dottify.me. However, after a nerve-wracking wait while the judging panel deliberated, it was announced: Trans*Resource US is the winner of the first trans* hackathon!

The Trans*Resource Us homescreen on mobile and tablet screens

Considering what devices your target audience use is an important part of any web design and development process. A large part of the Trans*Resource US front-end development was making the site responsive, in order to be viewable and accessible on as many screen types as possible.

While the team still has significant work to do to meet the goals of the website, a functioning alpha version is available at www.transresource.us.

Posted in Case Studies, News

Design Action Infographics

We think of an infographic in three levels depending on the goals of the specific campaign.

Some images need to add context to data or factoids through associated visuals/graphics. For instance, this ROC infographic presents key findings from a report they were releasing, in a format that is easily sharable via social media and provides a clear reference through the image, as to what the information they are sharing is in relation to.

The second model is where we use visuals to both provide context (through the image selection) and to “drive home” a message through visual representations of scale or time. Since raw numbers often don’t mean much to the general public, visual representations of those numbers and how they relate to each other can make a point better than statements. In this OilChange International infographic, we drive home the point that the “petcoke” alone, generated by keystone XL would be an enormous environmental problem:

Another example is this “scandal” infographic we did for Friends of the Earth, detailing the web of conflicts of interest behind a so called environmental impact report that not surprisingly was favorable to it’s industry backers. One of the key elements of both these infographics is the “at a glance” ability they have to present the core message. Those who are interested in the actual numbers or being able to articulate the actual sequence of events, are able to get that information from the infographic. But for the broader audience, the key point can be ascertained from a scan of the overall infographic:

Finally, there is the full scale infographic that combines data visualization with a narrative structure that can both tell a full story, using “at a glance” visuals that drive the main message home. These are generally the most involved, as they are in essence multiple data visualizations presented in a format that ties them all together through a “story” arc. This one we did for United for a Fair Economy takes a complex idea–that the housing crisis is a racially weighted issue–and breaks down why:

Blog post written by Inno. Illustrations and designs by Inno.

Posted in Case Studies, News

$10 for 10 Fights! CJJC’s new grassroots fundraising campaign

black-brown-unity-textureWe’re thrilled to announce the launch of a unique grassroots fundraising campaign that Causa Justa / Just Cause recently contracted us to design a campaign logo and commemorative poster for.

The concept behind the campaign is that community supporters choose one of 10 fights for justice that the organization is currently waging. On CJJC’s website supporters choose to back one of these particular fights and sign-up to give a monthly donation. Supporters who donate $10 or more per month will receive one of these limited edition “Viva la Union Afro y Latina” posters that we designed for them.

Click here to support Causa Justa / Just Cause in their $10 for 10 Fights grassroots sustainer campaign!

The poster was designed as an homage to a poster (shown at the bottom) by an unknown artist in the post-revolutionary period in Vietnam, and features images of Black and Latino CJJC members.

black-brown-unity-texture

khong

This Vietnamese poster says: “We Cannot Sit Quietly”.

Posted in Case Studies, News

Appealing designs for Appeals! (and other fundraising materials)

It’s getting to be that time of year… what I like to call Fundraising Season. Time for special events, end-of-year mailings, newsletters, and thinking about the annual report.

To get your fundraising juices going, we wanted to show you some good lookin’ and successful appeals that we’ve designed, as well as other communications pieces that help you to stay in touch with your membership and donor base.

“Our redesigned appeal mailing got more notice from our donors. Using full color printing and good design helps us show, instead of tell, all the work we’re doing. And the piece has a longer shelf-life making it  usable beyond just the appeal mailing.”

—Megan Swoboda, Co-Director, The Ruckus Society

Also, if you need consulting and more resources about your fundraising plan, check out Grassroots Institute for Fundraising Training and the Grassroots Fundraising Journal.

Check out our invitation portfolio for ideas for your special event. Check out more newsletters here for staying in touch with your membership and donor base.

 

 

Posted in Case Studies

Allied Media Conference 2013

Andrea Salazar presents a case study at Design Action's workshop, "Designers + Developers + Clients = !!!"

Andrea Salazar presents a case study at Design Action’s workshop, “Designers + Developers + Clients = !!!”

Design Action members headed to Detroit again this summer to build on conversations started at last year’s Allied Media Conference and to learn from all the awesome media makers and activists who came from around the country (and some international folks too).

At our workshop “Designers + Develpers + Clients = !!!”, Sabiha, Andrea, and Sarah presented case studies of successful collaborations highlighting best practices for creating websites for social justice organizations. Participants of this workshop came with questions to ask and challenges to share in a discussion so we could help each other come away with new insights on effective collaboration. You can read more about our discussion here.

Design Action also participated on a panel titled “Making a Living & a Life in Radical Tech” where we discussed ways to sustain ourselves in this work. Sabiha described the worker-owned cooperative model and offered advice to those starting new shops of their own. Notes can be seen here.

In addition to presenting, we attended workshops on data visualization, online surveillance and security, and research justice. We came back to Oakland with new skills and a sharpened framework for continuing our work creating communication tools for social justice campaigns. We look forward to working on more projects with you all!

Sabiha, Sarah, Misty (Aspiration Tech), and Andrea say good bye on the last day of the AMC.

Posted in Uncategorized