<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>alt-tag.com &#187; Design</title>
	<atom:link href="http://alt-tag.com/blog/archives/category/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://alt-tag.com/blog</link>
	<description>Thoughts on everything from education and politics to internet usability, and programming.</description>
	<lastBuildDate>Mon, 10 Oct 2011 21:42:29 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Programmers are arrogant</title>
		<link>http://alt-tag.com/blog/archives/2011/10/programmers-are-arrogant/</link>
		<comments>http://alt-tag.com/blog/archives/2011/10/programmers-are-arrogant/#comments</comments>
		<pubDate>Mon, 10 Oct 2011 21:42:29 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[ General]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Programming]]></category>

		<guid isPermaLink="false">http://alt-tag.com/blog/?p=312</guid>
		<description><![CDATA[I was visiting a marketing software company with a renowned professor when he said something that both startled and intrigued me: “Programmers,” he said, “are arrogant.” He’s right. We are. My mind flashed back to earlier this morning when I was reading comments on Hacker News about a supposed fork to a popular programming language. [...]]]></description>
			<content:encoded><![CDATA[<p>I was visiting a marketing software company with a renowned professor when he said something that both startled and intrigued me: “Programmers,” he said, “are arrogant.”</p>
<p>He’s right. We are.</p>
<p>My mind flashed back to earlier this morning when I was reading comments on Hacker News about a supposed fork to a popular programming language. The language author identified several flaws in a popular language, then set about to fix them. It’s arrogant to assume that his new product is better (there was some disagreement on this at HN), or that there would be enough adoption to make the project even partially as viable as its ancestor. Only time will tell whether he was right or not.</p>
<p>It’s arrogant to roll our own code rather than adopt existing libraries, but it happens all of the time.</p>
<p>It’s arrogant to think our code is as useful to others as it is to ourselves.</p>
<p>It’s arrogant to stress over the details of products we release, to insist on refining the corners and polish the surfaces only other coders see. </p>
<p>But without arrogance, nothing new would be built.</p>
<p>Arrogance challenges the status quo. It feeds the courage to try for a better way (even when we fail at it). The arrogance of builders, designers, and innovators gives us new things.</p>
<p>It’s our greatest weakness, and our greatest blessing.</p>
]]></content:encoded>
			<wfw:commentRss>http://alt-tag.com/blog/archives/2011/10/programmers-are-arrogant/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Images inside a CSS file</title>
		<link>http://alt-tag.com/blog/archives/2010/05/images-inside-a-css-file/</link>
		<comments>http://alt-tag.com/blog/archives/2010/05/images-inside-a-css-file/#comments</comments>
		<pubDate>Sat, 29 May 2010 03:02:54 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Web Standards]]></category>

		<guid isPermaLink="false">http://alt-tag.com/blog/?p=218</guid>
		<description><![CDATA[I was experimenting with my own version of the CSS3 Awesome button, when I noticed one of the commenters share the base64 encoded version of the semi-transparent PNG image they were using as a substitute for a gradient. I was using a smaller image, and want to run a conversion of my own (it saves [...]]]></description>
			<content:encoded><![CDATA[<p>I was experimenting with my own version of the CSS3 <a href="http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba">Awesome button</a>, when I noticed one of the<a href="http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba#comment6189"> commenters</a> share the <a href="http://en.wikipedia.org/wiki/Data_URI_scheme">base64 encoded</a> version of the semi-transparent PNG image they were using as a substitute for a gradient.</p>
<p>I was using a smaller image, and want to run a conversion of my own (it saves an extra HTTP connection, making it easier on both the client&#8217;s browser and the server). A quick trip to Google turned up <a href="http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/">an online conversion tool</a> that worked great.</p>
<p>Wikipedia also provides <a href="http://en.wikipedia.org/wiki/Data_URI_scheme#Inclusion_in_HTML_or_CSS_using_PHP">sample code</a> for doing conversions with PHP: (Please notice there is no error handling!)<br />
<code class="codeblock php">&lt;?php<br />
<span class="function">header</span>(<span class="string">'Content-type: text/css'</span>);<br />
<span class="keyword">function</span> <span class="function">data_uri</span>($file, $mime)  {<br />
  $contents = <span class="function">file_get_contents</span>($file);<br />
  $base64   = <span class="function">base64_encode</span>($contents);<br />
  <span class="function">return</span> (<span class="string">'data:'</span> . $mime . <span class="string">';base64,'</span> . $base64);<br />
}<br />
?&gt;<br />
body {<br />
  background-image:url('&lt;?php <span class="function">echo</span> <span class="function">data_uri</span>(<span class="string">'elephant.png'</span>, <span class="string">'image/png'</span>); ?&gt;');<br />
}</code></p>
]]></content:encoded>
			<wfw:commentRss>http://alt-tag.com/blog/archives/2010/05/images-inside-a-css-file/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Turbo-charging the color picker</title>
		<link>http://alt-tag.com/blog/archives/2010/05/turbo-charging-the-color-picker/</link>
		<comments>http://alt-tag.com/blog/archives/2010/05/turbo-charging-the-color-picker/#comments</comments>
		<pubDate>Sat, 29 May 2010 02:25:12 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Computers]]></category>
		<category><![CDATA[Design]]></category>

		<guid isPermaLink="false">http://alt-tag.com/blog/?p=211</guid>
		<description><![CDATA[It&#8217;s probably old hat to anyone doing design for a living, but I found a couple of new color tools for OS X that are making my web design work easier. I use TextMate for coding, and wasn&#8217;t thinking about the CSS bundle item that brings up OS X&#8217;s default color picker (Command-Shift-C; the TextMate [...]]]></description>
			<content:encoded><![CDATA[<p>It&#8217;s probably old hat to anyone doing design for a living, but I found a couple of new color tools for OS X that are making my web design work easier.</p>
<p>I use <a href="http://macromates.com/">TextMate</a> for coding, and wasn&#8217;t thinking about the CSS bundle item that brings up OS X&#8217;s default color picker (Command-Shift-C; the TextMate bundle automatically copies in the color using hex notation), I was pleased by a <a href="http://www.macosxhints.com/article.php?story=20060408050920158">tip from macosxhints.com</a> showing how to write a one-line Applescript app that shows the color picker.</p>
<ol>
<li>Open &#8220;AppleScript Editor.app&#8221; (in the Applications folder)</li>
<li>Enter the following:<code class="codeblock">choose color</code></li>
<li>Save it. Change the file format to &#8220;Application&#8221; in the save dialog.</li>
<p>I added an icon I grabbed from <a href="http://iconfactory.com/freeware/">iconfactory.com</a>. (Download the icon set you want to use. Right-click on the new application, and pick &#8220;Get Info&#8221;, and drag-and-drop your desired icon over the application&#8217;s icon.)</p>
<h3>Even more turbo-charging the Color Picker</h3>
<p>I also found two free plug-ins for the color picker. The first was <a href="http://wafflesoftware.net/hexpicker/">&#8220;Hex Color Picker&#8221; from Waffle Software</a>, which outputs the hex version of a color suitable for CSS (although I&#8217;m using the RGB values more and more). The second was a plugin called <a href="http://www.lithoglyph.com/mondrianum/">Mondrianum</a> which utilizes Adobe&#8217;s <a href="http://kuler.adobe.com/">Kuler</a> palette service. To top it off, I learned you can create your own palettes in the color picker (it&#8217;s the third tab).</p>
<p>Awesomeness all around.</ol>
]]></content:encoded>
			<wfw:commentRss>http://alt-tag.com/blog/archives/2010/05/turbo-charging-the-color-picker/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Data visualization and unemployment</title>
		<link>http://alt-tag.com/blog/archives/2009/11/data-visualization-and-unemployment/</link>
		<comments>http://alt-tag.com/blog/archives/2009/11/data-visualization-and-unemployment/#comments</comments>
		<pubDate>Sun, 22 Nov 2009 17:51:45 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Communication]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Economics]]></category>
		<category><![CDATA[U.S. Politics]]></category>

		<guid isPermaLink="false">http://alt-tag.com/blog/?p=196</guid>
		<description><![CDATA[I&#8217;m fascinated by data visualization. Expressing complex ideas in a simple way is immensely powerful. In my post yesterday, I linked to a county-by-county time lapse of unemployment rates. I&#8217;ve found some interesting images (complete with a thorough explanation) examining the U.S. economy. The article is interesting, but the images, if you&#8217;ll pardon the cliché, [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m fascinated by data visualization. Expressing complex ideas in a simple way is immensely powerful.  In <a href="/blog/archives/2009/11/unemployment-map/">my post yesterday</a>, I linked to a<br />
<href ="http://cohort11.americanobserver.net/latoyaegwuekwe/multimediafinal.html">county-by-county time lapse of unemployment rates. I&#8217;ve found some interesting images (complete with a thorough explanation) examining the U.S. economy. The article is interesting, but the images, if you&#8217;ll pardon the cliché, really are worth a thousand words. A sample of images is included below&#8211;visit <a href="http://www.uuorld.com/blog/?p=937" title="UUorld: &quot;US Unemployment in 2009---More Job Losses in Production">the full article</a> for more.</p>
<p style="text-align:center"><strong>Mass-layoff events for 2008-2009:</strong><img src="/blog/blogimages/20091122_mass_layoff_by_state_2008-09.jpg"/></p>
<p style="text-align:center"><strong>Percentage of workforce employed in manufacturing (2006):</strong><img src="/blog/blogimages/20091122_employed_as_manufacturing_2006.jpg"/></p>
<p style="text-align:center"><strong>Unemployment (2008):</strong><img src="/blog/blogimages/20091122_unemployment_2008.jpg"/></p>
<p>A while ago, I <a href="<a href="/blog/archives/2009/09/big-numbers-and-visualization/">asked how government would change if budgets were presented visually</a>. In a similar vein, how would education change if achievement data were also presented visually? Would our decisions change? Why?</p>
<div class="seeAlso">All images the article by George Maasry, <a href="http://www.uuorld.com/blog/?p=937">&#8220;US Unemployment in 2009&#8212;More Job Losses in Production&#8221;</a>, UUorld.com, 2009-03-09.</div>
</href>
]]></content:encoded>
			<wfw:commentRss>http://alt-tag.com/blog/archives/2009/11/data-visualization-and-unemployment/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Big numbers and visualization</title>
		<link>http://alt-tag.com/blog/archives/2009/09/big-numbers-and-visualization/</link>
		<comments>http://alt-tag.com/blog/archives/2009/09/big-numbers-and-visualization/#comments</comments>
		<pubDate>Wed, 30 Sep 2009 23:21:59 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Communication]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[U.S. Politics]]></category>

		<guid isPermaLink="false">http://alt-tag.com/blog/?p=168</guid>
		<description><![CDATA[Go here first. Then come back. I&#8217;ll wait. The trouble with talking about government budgets, even ones as small as a city or local school district, is that big numbers rapidly lose meaning to people. It&#8217;s more visceral to talk about a dozen people (or dollars or &#8220;things&#8221;) than to discuss a million of then. [...]]]></description>
			<content:encoded><![CDATA[<p>Go <a href="http://www.informationisbeautiful.net/visualizations/the-billion-dollar-gram/">here</a> first. Then come back. I&#8217;ll wait.</p>
<p>The trouble with talking about government budgets, even ones as small as a city or local school district, is that big numbers rapidly lose meaning to people. It&#8217;s more visceral to talk about a dozen people (or dollars or &#8220;things&#8221;) than to discuss a million of then. Big numbers are hard to visualize.</p>
<p>Take dictionaries for example. Without peeking, is 10,000 words a good dictionary? What about 20,000? How many words are there in a typical collegiate dictionary? Take a guess before looking at the <a id="ref_20090930_1" href="#foot_20090930_1 ">answer</a>.</p>
<p>You&#8217;ve heard the politicians say it (and it&#8217;s true): &#8220;A million here, a million there and pretty soon we&#8217;re talking real money.&#8221; One of the ways I try to make the number a bit more &#8220;real&#8221; is to estimate how many people could be employed at a particular job for that amount. Try it. How many professional workers (between $50,000&#8211;60,000 annual salary) can be employed in government jobs for $1M? (<a id="ref_20090930_2" href="#foot_20090930_2">My answer</a>.)</p>
<p> John Gruber <a href="http://daringfireball.net/linked/2009/09/30/billion-dollar-gram">linked</a> to a blog called <em>Information is Beautiful</em>, highlighting <a href="http://www.informationisbeautiful.net/visualizations/the-billion-dollar-gram/">an impressive infographic comparing budget numbers in the billions</a>. (The same link that starts this post. Once there, click the graphic to see how the data was sourced, along with viewer comments.) Go see it!</p>
<p>How would government change if budget committees published these numbers visually instead of numerically?</p>
<div class="seeAlso">
<h3 id="foot_20090930_1">1. Dictionaries</h3>
<p>Chances are, if you guessed how many words are in a dictionary, you anchored around the numbers I listed above (e.g., 20,000). The number is way too low! At less than two inches thick, the <a href="http://www.merriam-webster.com/cgi-bin/book.pl?c11.htm&#038;1"><em>Merriam-Webster Collegiate Dictionary (11th)</em></a> boasts 10,000 <em>new</em> words in the most recent edition, bringing its total to more than 225,000 definitions. Even the tiny <a href="http://www.merriam-webster.com/cgi-bin/book.pl?pktdict.htm&#038;1"><em>Merriam-Webster&#8217;s Pocket Dictionary</em></a>, a 7 x 4.2 x 1.6 inch paperback, has more than 40,000 words. (<a href="#ref_20090930_1">^ top</a>)</p>
<h3 id="foot_20090930_2">2. One million dollars</h3>
<p>These are rough back-of-the-napkin numbers. YMMV. At $50K salary/year, a company is responsible for an additional $4K in FICA and other taxes. The large non-salary chunk is benefits, which for many government positions the employer pays the lion&#8217;s share. If we low-ball the number at $1K/month for a family plan, that&#8217;s an additional $12K/year (running total=$66K/year). Throw in a computer workstation (replaced every three years; less often in gov&#8217;t), software, tech support, utilities, renting the office space, custodial, parking, worker&#8217;s compensation, and who knows what else, and a very low cost estimate (read: wild guess) might be another $5K/year. (running total = $71K/year) <em>And I&#8217;m not factoring in 401-K contributions or pension liability, which will probably add another 10% to our figure.</em> (Less for defined contribution plans.) Tack on another 5% to build in a margin of error (total = $75K/year), and one million dollars employs just over 13 people. A baker&#8217;s dozen. </p>
<p>Thirteen is not very many&#8212;not even enough to add just one employee to every elementary school in Provo, Utah. That figure drops to 10 people if we create higher paying jobs and offer a $60K/year salary.  (<a href="#ref_20090930_2">^ top</a>)</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://alt-tag.com/blog/archives/2009/09/big-numbers-and-visualization/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

