Canary Promotion + Design is seeking qualified freelancers for web design, Drupal site building, and Drupal theming projects. We have a busy schedule of active projects for a variety of clients in the Arts, cultural and nonprofit sectors. We’re looking to find people who can demonstrate their ability to get up and running quickly and deliver excellent, creative work on deadline.

Web Designer

Responsibilities

Develop site maps, IA, wireframes, & moodboards
Design graphical layouts and interfaces
Cross-browser quality assurance testing
Deliver designs as clean semantic markup with progressively enhanced css & javascript + source files

Core Skills

• 3+ years of design experience or an exceptional portfolio
• A strong understanding of visual design and how it can shape and influence user experiences
• Strong conceptual design, collaborative, interpersonal and organizational skills
• Ability to rapidly design mockups
• The ability to hand code HTML/CSS/JS
• A working knowledge of the Jquery library
• Familiar with the general front end development best practices
• A familiarity with content management systems
• A dedication to detail and deadlines
• A demonstrated ability to effectively manage projects from concept to completion

Pluses

• Familiarity with Drupal
• Experience with Sass & Compass
• HTML5
• CSS3
• Experience with Arts, Education, and Cultural Institutions

Drupal Site Builder

Responsibilities

Develop build plan from site map and wireframes
Install and configure Drupal
Select, install and configure appropriate contributed modules
Build content types & views
Deliver a working site ready for a designer/themer

Core Skills

• 1+ years of experience or an exceptional portfolio
• Familiar with the “state of Drupal” & best practices
• Familiarity with Subversion VCS
• Ability to write simple custom modules
• Strong collaborative, interpersonal and organizational skills
• A dedication to detail and deadlines
• A demonstrated ability to effectively manage projects from concept to completion

Pluses

• Active within Drupal community
• Familiarity with Drush
• Familiarity with Panels, Features
• Appreciation for semantic markup
• Theming / front-end development skills
• Complex module development
• Experience with Arts, Education, and Cultural Institutions

Drupal Themer

Responsibilities

Develop a site theme on a working unthemed Drupal site
Build theme to match supplied design and HTML / CSS on key site pages
Write custom HTML / CSS for all other pages
Install and configure theme-specific modules
Configure Views 2 for markup
Write/modify custom template files (tpl.php)
Some content entry
Cross-browser quality assurance testing
Deliver a finished site ready for launch

Core Skills

• 2+ years of front-end development experience or an exceptional portfolio
• Familiar with the “state of Drupal” & best practices
• Familiar with front end development best practices
• The ability to hand code HTML/CSS/JS
• A working knowledge of the Jquery library
• Appreciation for semantic markup
• Strong collaborative, interpersonal and organizational skills
• A dedication to detail and deadlines
• A demonstrated ability to effectively manage projects from concept to completion

Pluses

• Active within Drupal community
• Familiarity with advanced theming techniques (preprocess functions, other theming frameworks)
• Experience with Sass & Compass
• HTML5
• CSS3
• Familiarity with Drush
• Familiarity with Panels, Features
• Familiarity with Subversion VCS
• A strong understanding of visual design
• Ability to write simple custom modules
• Experience with Arts, Education, and Cultural Institutions

About Canary Promotion + Design

Canary Promotion + Design is committed to working with nonprofit and mission-driven clients.  Our clients include education and advocacy organizations such (Philadelphia Young Playwrights, Future of Music Coalition), museums and art institutions (Rosenbach Museum & Library, The Design Center at Philadelphia University), major arts festivals (Live Arts Festival & Philly Fringe, Philagrafika 2010), theater and dance companies (The Wilma Theater, Bristol Riverside Theatre, Pig Iron Theatre Company, Nichole Canuso Dance Company), music venues and presenters (Johnny Brenda’s, Ars Nova Workshop), authors and literary publications (Neil Baldwin, American Poetry Review), national television shows (The Colbert Report), and various other nonprofit organizations and businesses. We believe in building personal relationships and long-term partnerships with our clients, many of whom have continued to work with Canary year after year.

Established in 2001, Canary Promotion + Design is founded and run by people who are truly invested in the nonprofit, cultural and creative communities. Co-founders Mason Wendell and Megan Wendell bring to each project over 12 years of experience working in various fields of the arts & culture, entertainment and technology industries.

Our services encompass both the visual and verbal communications needed to effectively tell our clients’ stories.  Our personalized publicity, branding and marketing services specialize in integrating new media strategies with traditional techniques to create wide-reaching media campaigns while encouraging more personal audience interactions.

Our custom websites feature beautiful, functional and friendly design using the Drupal content management system and framework. We’re pragmatic, inventive, and equally at home designing and writing code. We look for challenges and find solutions.

To Apply

Please email resumes, portfolio sites, and other relavent links to: mason@canarypromo.com

Thanks to everyone who helped make yesterday’s DrupalCamp Philadelphia so much fun and a success. I was really feeling all kinds of Drupal love from all around. Hope so all of you an more the next time we do this.

As promised, I’m uploading my slides from my presentation. They’re just the slides for now, but I’ll update w/ video once all the video from the day is online.

Drupaldelphia Shortcuts Cheats And Cheap Stunts!

Rethink your workflow to fix a lame design and rock your theme development.

Download as .pdf

Links from the presentation

http://blueprintcss.org

http://960.gs

http://drupal.org/project/studio

http://drupal.org/project/zen

http://drupal.org/project/stark

http://drupal.org/project/drush

http://drupal.org/project/devel

http://drupal.org/project/admin

http://compass-style.org

In our last post on designing with grids, we created an overlay layer in Photoshop that we use while designing so we can visualize the css grid we’ll eventually code while we’re designing. Today I’ve got another flavor of that, but this time we’re in the browser, and checking our CSS against the grid as we go.

Blueprint comes with a technique for showing the grid in CSS. Just class your .container element as “.showgrid” and it will use your grid graphic as the background image. There are a couple problems with this tho.

• It replaces your desired page background, and you might need that at this stage.
• It’s not really easy to just turn it on and off to quickly check your work.

Since we work in Drupal most of the time we tackled this for our projects by creating a Drupal module that overlays a simple “show grid” button on the upper left corner of the screen that will apply the grid and replace it with our default styles on each click.

So far it’s pretty basic. There’s no admin interface and you have to customize the jquery file for each project. We plan on fixing those aspects soon and contributing it up to Drupal.org. Until then, tho, I’m putting it here for anyone to try it out. Enjoy!

Grid Overlay Drupal Module

Here at Canary we’re big proponents of tools that help us get the job done. When it comes to our CSS layouts lately we’ve been using the Blueprint CSS framework in our workflow. We’ve found that despite the trade-offs (some non-semantic html), we get a lot of benefit from the system. There’s a great CSS reset that removes all the default browser styling, it’s been cross-browser tested, pretty good out-of-the-box typography settings, and both a baseline and horizontal grid.

About Blueprint (from blueprintcss.org):

Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.

The grid is what I’m going to focus on here. There are a lot of CSS frameworks that provide a grid, but there’s a tool for Blueprint that we’ve been using to create custom grids. This gives us the freedom to set the page width and number of columns to whatever we need for the site, and generates the structure for us that we use in our design and development process.

Download Blueprint and set it aside for now. You’ll use this when you’re building the site.

Go to the Blueprint Grid CSS Generator and enter the specs for your custom grid. I’ve found that I can play around with this in order to create the exact grid I need for each project. Once you’ve got the setting you want, click ‘Generate CSS’. Copy and save the Grid.css and compressed.css files. You’ll use those to overwrite the default grid that came with Blueprint. Now flip over to the Grid.png tab. The script created this png file from the specs you entered. It represents one cell of your new grid. Save this file. It’s intended to replace the default grid.png file that you get with Blueprint, but we’re also going to use it as a guide in Photoshop. (It’s tiny, and a little hard to see both in the generator and below)

Open the grid.png file in Photoshop. Convert the color mode to RGB. (you may not need to do this, but I’ve occasionally had problems when I didn’t.) Now select Edit->Define a Pattern. You can keep the default name and click OK.

Now create an empty document that is the width of your grid for your website. It can be any height, but I usually start with at least 1000px tall. Fill a new layer named ‘grid’ with a solid color.

Create a new layer style for that layer and select the Pattern Overlay tab. Set the blend mode to ‘multiply’ and choose ’snap to origin’. Open the ‘Pattern’ selector and choose your new pattern. It should be the last one in the list. Now go to the ‘Blending Options’ tab and under Advanced Blending set the fill opacity to 0%.

You now have a semi-transparent custom grid that you can place over your other layers to guide you as you design!

And here it is in action. This is a little preview of our new site in progress. 10 points to you if you spot the temporary heading title!

Advanced Trick!

Set up a couple custom actions to turn your ‘grid’ layer on and off with a key command. We’ve found that really helps us quickly check our alignment as we work.

Watch out for part 2 in this series, in which we’ll divulge how we incorporate Blueprint into our Drupal theming process. [Now we're on the hook to write it!]

We’re looking for a creative and talented web designer/developer to help us make beautiful and inspiring web stuffs. You’ll be working with a small team on big projects so you’ll get your hands dirty at every stage from initial concepts to final delivery. This is an excellent opportunity with a rapidly-growing graphic design, public relations and marketing company based in Philadelphia, PA. We have excellent clients and projects (primarily in the arts and entertainment industry) that will keep you inspired and excited.

Primary Skills Desired

•  XHTML
•  CSS
•  Drupal experience a plus

Other Skills Desired

•  PHP
•  MYSQL
•  Photoshop
•  Illustrator
•  Flash
•  Actionscript

We are looking for interns for the Spring and Summer months, between April & October (flexible). A minimum 8-week commitment is required. Minimum of 15 hours per week. We are flexible and can devise a schedule that works for all. Available for college credit; a small stipend is negotiable.

Work must be done on-site at our office. Our office is located on Germantown Avenue in the Mt. Airy neighborhood of Philadelphia and is accessible by two regional rail lines from Center City (R7/Sedgwick Station and the R8/Allen Lane), as well as the 23 bus. Free parking is available in public lots or on adjacent streets.

How to apply

To apply, please familiarize yourself with our company and our clients. Email your resume to noelle@canarypromo.com Include a brief introduction about yourself and links to work samples demonstrating desired skills.

I was considering whether to spend my last dollar playing the ponies or on diapers for my baby, and as I flipped the money over between my sweaty hands I looked down. And for the first time it wasn’t the all-knowing gaze of that pyramid eye that I pondered, but this bad-ass eagle. He’s ready to kick your ass if you don’t love democracy.  That frickin’ rules, and I immediately thought it had to go on a t-shirt.

And so…

Canary just submitted our design for the DrupalCon DC tshirt contest. It’s inspired by The Great Seal of the United States.

Vote this up if you want to look like a $1,000,000!

It says E. Pluribus Drupal! You know you want to wear this!

Vote!

Also, don’t forget to register to attend DrupalCon this March. We’ll be there, so it should rock pretty hard.

It’s been our pleasure to work with distinguished author Neil Baldwin over the past several months.  Canary redesigned www.neilbaldwinbooks.com and created a custom content management system utilizing the  Drupal platform and a grid-based custom theme.

Neil was kind enough to send us the testimonial below.  For more from our clients, check out our testimonials page.

“I was petrified when www.neilbaldwinbooks.com began to receive its makeover from Canary. Intuitively I felt that I knew what I wanted, but despite — or perhaps because of — being an author, I had trouble expressing these needs to Mason, John and the Canary team. Of course, from the moment they came back with slate blue and earthy brown as the basic colors for the site (I had never even told them that blue and brown were my favorite colors), I was in the right hands & never looked back. I also admit that I was even more petrified when Mason told me — once my new site was built — that he was going to teach me (omigod, as they say…) how to go into the invisible infrastructure and make changes on my own. Yet again, John and Mason patiently talked me through the looking glass, and, before too long, I got used to the subversive nature of what I was doing. We literati develop an intense ownership over our work. Canary ‘gets’ this obsession intuitively and respects it as well. The best attribute of Canary? They combine cutting-edge creativity and inductive reasoning with infinite patience — and they are always there when I need them.”

Canary Promotion + Design is proud to be a sponsor of the first BarCamp Philly!

The first-ever BarCamp Philly, an all-day collaborative event for people involved in technology, media and creative fields, will be held on Saturday, November 8th at The University of the Arts in the Terra Building, located at 211 S. Broad Street (Broad & Walnut). Registration will begin at 8:00 a.m., and sessions will run from 10:00 a.m. to 6:00 p.m. BarCamp Philly creates opportunities for participants to share knowledge, experience and support with one another in an open, classroom-style environment.

With over 200 registered attendees, registration has been closed, but people still interested in attending may add their names to a waiting list for possible openings. For more information, visit www.barcampphilly.org.

Philadelphia’s first BarCamp, organized by JP Toto and Roz Duffy, is part of an international network of BarCamps which have taken place across North America as well as in South America, Europe, Africa, Asia and Australia. It’s also part of a city-wide movement to encourage a collaborative creative community.

“With events like BlogPhiladelphia, PodCamp Philly and Ignite Philly bringing people from all over the region together to be inspired, BarCamp seemed to be a natural next step,” says Duffy, a web producer and a founding member of Independents Hall. “The connections that are possible may lead to new collaborations, new projects, future events. Hopefully it will bring more attention to our fine city!”

Toto, owner of a small technology consulting firm called 30Points Design & Consulting, attended his first BarCamp in Orlando. “I was hooked instantly,” he says. “About a month later, I attended Social Dev Camp East in Baltimore where I met fantastic like-minded developers, creatives and community organizers. After that it was obvious to me that Philadelphia needed to hold its first BarCamp. We hope that events like this inspire other folks to step up, organize more events and help lead the city’s technology and cultural growth.”

The events’ content is provided by participants, with the schedule being determined the morning of November 8th. All attendees are invited to present at BarCamp Philly and can sign up on a schedule when they arrive. Participants include web developers, designers, entrepreneurs, software engineers, public relations, marketing and social media specialists, community organizers and students.

Through BarCamp Philly’s website, participants have been exchanging ideas on session topics, which could include entrepreneurship, product design, branding, the broader social impact of social media and new technology, community organizing through social networking, understanding open source licenses, how to develop web or iPhone applications, and the state of the creative economy.

BarCamp Philly is sponsored by The University of the Arts, 30Points Design & Consulting, Canary Promotion + Design, ChoiceShirts, Comcast Interactive Media, Microsoft, Mother’s Work, Umlatte, AlertBot, BadCat Design, Empressr, Independents Hall, P’unk Ave, Rock River Star, and Wharton Learning Lab.

The name BarCamp originates as a play on Foo Camp, an invitation-only event held by open source publisher Tim O’Reilly. The first BarCamp was held in 2005, in Palo Alto, CA. The open invite event was a huge success and thus spawned a series of BarCamps all over the globe from Boston to New Zealand to India to Orlando and on November 8, 2008 in Philly. For more information on the BarCamp concept and events around the world, visit www.barcamp.org.

To schedule interviews and event coverage, please contact:
Megan Wendell, Canary Promotion
(215) 242-6393, megan@canarypromo.com

I just did, and I feel great!