design
User Testing Websites
0A few user testing websites – know of any others?
http://www.loop11.com/pricing/
http://www.optimalworkshop.com/chalkmark.htm
http://www.usertesting.com/
http://www.userzoom.com/
Browser Tabs #0
0I regularly have way too many tabs open. Rather than bookmark them or log them in delicious, I’m going to start listing them here. It will act like a snapshot of what’s going on in my brain…? I think that’s interesting. Maybe you will too.
- http://www.beeratjoes.com/index.php/beer-dinners/spent-grain-beer-bread/
- http://www.realbeer.com/discussions/showthread.php?t=11228
- http://www.instructables.com/id/Etched-Copper-Board-Valentines-Day-art-wLEDs/#step0
- http://www.harkavagrant.com/index.php?id=152
- http://www.amazon.com/gp/search/ref=pe_77460_18793460_pe_09/?ie=UTF8&rh=n:1055398,n:!13900811,n:!1063496,n:331401011,n:284507,p_6:ATVPDKIKX0DER,n:13162311,n:13217501,n:13217701&page=1&bbn=331401011
- http://www.jagjaguwar.com/home.php
- http://chicago2011.drupal.org/tickets-and-registration
- http://bamfestpdx.com/schedule.html
- http://www.goldmine-elec-products.com/prodinfo.asp?number=C6900
- http://www.workbenchdesign.net/walkaround/walkaround.html
- http://www.workbenchdesign.net/
- http://www.skycraftsurplus.com/toolstoolkits.aspx
- http://www.closegrain.com/2010/08/portable-workbench.html
- http://www.instructables.com/id/Stop-using-Ferric-Chloride-etchant!–A-better-etc/?ALLSTEPS
- http://www.redwallprints.com/Services.php
Quick Printing Trick for Barrel Folded Tri-Fold Mailers
0I recently designed and printed a two-sided barrel-folded mailer for an upcoming fundraiser. I ran into an issue that I had to resolve quickly, as I was printing the job on a client’s printer, from their computer, using limited software (read: MS Word).
I know, blasphemy – but we needed a quick fix and I got the job done.
Problem
Barrel-folded mailers generally require the two outer end-panels to be printed 180° to the angle of the main body copy. The top panel is where the return & mailing address go (the first flap you open), and other is inside the flap (the second flap you open). Thus, some text needed to be upside-down.
Solution
After fumbling through Word (I cringe as I capitalize it) I decided against flipping the text in the program, opting instead to flip the paper and slide the text to the bottom of the page. This achieved the desired result in much less time than searching through help or online. While this technique isn’t revolutionary, it is a good reminder to think beyond software and into the actual material you are printing on. A simple flip or fold could lead to a creative solution for a complex problem.
10 Tips for HTML Email Lists, Templates, and Campaigns
0Developing a good-looking email campaign should be easy, right? You’d be amazed at how backwards the process is. This post assumes you have the technical and creative chops to hosting the email service yourself, rather than choosing a paid service like constant contact or mailchimp. Where’s the fun in that?!
From choosing the right host to archaic css support, here are some tips to help you remedy the malaise of maligned markup and hosting services:
- Start with a plan. You need to know five things:
- how many people you plan on reaching
- how frequently you will be emailing them
- what features you would like (html vs plaintext, images, etc.)
- the duration of your campaign
- your budget
- Find email list software that does everything you need it to do and is easy to use. Generally, they have demo sites where you can test out their features. Some even integrate with popular CMSes, like Drupal, WordPress, and Joomla. Try several of them out until you find something that you like and that is either offered by your host, or that can easily be installed. Choosing software with good documentation and a large, nerdy user base is typically a good bet.
- If you are planning on sending a lot of emails, find a host that allows it. Hosts typically set a throttling rate to govern the number of emails that can be sent per hour and per day. Defaults on these figures are usually low, but can often be raised after contacting customer support. Do some research beforehand and you’ll be okay.
- Make sure the email list software you are using – as well as your host – aren’t blacklisted by major mail servers like gmail, yahoo, etc. Similarly, make sure your host’s filtering/spam settings are either disabled or allow for large quantities of outgoing mail with your keywords.
- Keep the design simple. Most mail clients and online email service providers allow for minimal use of css and html. They vary drastically in their support (you can find more info here: http://www.email-standards.org/ ), but here are some quick pointers:
- Use tables for optimum control over content alignment. Some email clients don’t render floating elements properly and certainly don’t degrade elegantly. You can avoid tabular layouts altogether if you keep your design simple with a single column of text.
- Avoid the default line length; in other words, your text shouldn’t run as wide as the window. There are two reasons for this:
- It is harder to read
- It won’t grab the reader’s attention to begin with – it looks like most junk they get in their inboxes. Even if they do start reading it, make it easier by limiting the width of a text block to 35-55 characters, either by setting a css width on your containing element, or by using deprecated methods like setting the width attribute in a table.
- Use inline css on each element that you want to configure
- Counter-intuitively, don’t depend on the “cascade” in body css – in other words, if you want all of your text to be styled with font-family: verdana, you might need to place that on each element
- Related to the previous point, avoid using css in the body element; some mail engines strip all html that is outside of body, including body.
- Avoid images as CSS backgrounds – instead, use image elements and get creative; a well designed image can create a fake page-corners, fades, and other common html graphics techniques. (a great example is the Organizing for America Campaign)
- Design for your audience. If you don’t know who that is, do some research. There’s nothing wrong with designing as broadly as possible – but with clear guides. If you know people who have difficulty reading small text will be receiving your email, ensure the text is large enough and with sufficient contrast. Don’t make it gaudily large, around 12-16px in many common webfonts generally does the trick. Images can’t be read by screen readers without alt attributes, so always include them. Title attributes are helpful as well, for mouseovers.
- Make sure the email has a clear goal and that it is easy to achieve; use image and text links to guide the reader to an actionable task. Generally, these links should point to a landing page on your site from which you can collect referral information.
- Make sure your content is engaging. From the images to the copy, everything should be designed to appeal to the reader’s senses and sensibilities. Knowing your audience is crucial for this step, so do some research if you haven’t already.
- Test, test, test. If you don’t have accounts on the major email services, sign up for them. I would advise keeping track of these usernames/passwords in a safe place (http://keepass.info), for future testing purposes. Avoid filling out personal information other than what is required by law. While I don’t condone creating false aliases, I also don’t condone data-mining, as commonly practiced by google/gmail. Tread carefully and wisely. Also, download and/or purchase major email clients (thunderbird, outlook, eudora, etc.), configure them with the appropriate server settings, and test there too.
- Finally: know the law. The European Union and a few states require opt-in/out clauses and privacy policies to be provided at the time of sign-up and linked in every transmission. Unless you’re living in China, North Korea, or other places where access to information is limited (among other things), the internet is boundless – you can’t plan on never getting a hit from the EU, California, Minnesota, Nevada, or other places where laws exist to protect privacy over the web. While it’s unlikely that problems will arise, they can be avoided altogether by including these things. The best way to protect yourself is to know the law and plan for future problems. I’m by no means a lawyer, but I have taken a course in internet/information law. If you’re uncertain, you should probably set up a consultation meeting with a bar-certified professional specializing in this area. A great online resource is http://www.epic.org You can sign-up for their feeds to stay on top of current electronic privacy legislation, cases, and so on.
There are certainly more techniques and considerations, but these should help get you started if you’re uncertain or new to managing and designing email lists. While I strongly condone pushing browser standards forward, the state of email rendering is even less homogeneous – and emails translate into business and money. While it’s great to support and use standards, the burden of implementing standards compliant emails shouldn’t be on the client. Designers & developers need better support from corporations. Full stop, end of transmission.
Saving Illustrator CS4 Preferences
0While Adobe products are industry standards, they are still not without serious workflow issues.
One of my major gripes is Illustrator’s inability to save and load preferences from within the program. This would come in handy when working in different units, as I regularly do; The 10px grid I use for web work isn’t compatible with an imperial or metric grid for print work, and vice versa. Luckily, I’ve devised a workaround.
- First, you’ll need to find your Ai preferences file. For Windows 7, it can be found in a hidden folder:C:\Users\Username\AppData\Roaming\Adobe\Adobe Illustrator CS4 Settings\en_USFrom your explorer window, drag the en_US folder to your start menu and Pin it there. In OS X, you can similarly make a link to the folder and keep it in your Dock, desktop, or wherever you fancy. The file we’ll be renaming later is named AIPrefs (no extension)- we’ll deal with that soon enough. If you don’t have hidden folders visible, here’s how. If you’re on a different OS, or using a different version of Illustrator, have a look here, or search the nets.
- Open Illustrator, start a blank document, and set your preferences. The document type doesn’t matter.
- Close Illustrator.
- Open the folder you linked in step 1, copy and rename your preferences file to something descriptive like AIPrefs[web]. It’s crucial to copy so we don’t accidentally modify or delete our manually defined preferences.
- Repeat steps 2-4 for each grid-setup or preferences variation you need.
- Now you’re ready to use your custom preferences. Before you reopen Illustrator, delete the current AIPrefs file.
- Copy the preferences file you want to use and rename it to AIPrefs.
- Start Illustrator and behold the glory.
Obviously, if the last thing you worked on is for web, and the current thing you worked on is for web, you don’t have to change the AIPrefs file, so it might be helpful to keep a note of which file is currently active. You can also search the AIPrefs file to see how Illustrator is modifying the contents. It’s for the most part readable alpha-numeric content. If anyone knows of a better way to do this, please let me know. Ciao.