<?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>theFourthStar.com :: Professional Design &#38; Web Portfolio of Cara McKinley &#187; Play</title>
	<atom:link href="http://www.thefourthstar.com/category/play/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.thefourthstar.com</link>
	<description></description>
	<lastBuildDate>Mon, 19 Dec 2011 03:13:10 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Badass Duvet Cover (and I&#8217;m done with sewing for a while)</title>
		<link>http://www.thefourthstar.com/2011/02/badass-duvet-cover-and-im-done-with-sewing-for-a-while/</link>
		<comments>http://www.thefourthstar.com/2011/02/badass-duvet-cover-and-im-done-with-sewing-for-a-while/#comments</comments>
		<pubDate>Mon, 21 Feb 2011 06:43:37 +0000</pubDate>
		<dc:creator>Cara McKinley</dc:creator>
				<category><![CDATA[Needle & Thread]]></category>
		<category><![CDATA[home decor]]></category>
		<category><![CDATA[Useful things]]></category>

		<guid isPermaLink="false">http://www.thefourthstar.com/?p=448</guid>
		<description><![CDATA[A couple years ago I got super ambitious about d.i.y interior decorating, during a period of frustration with the limited personality of mass market stuff available at everyone&#8217;s favorite chain stores (also, I got a subscription to Ready Made, which I&#8217;m sure had something to do with it). As a part of this, I tried [...]]]></description>
			<content:encoded><![CDATA[<p>A couple years ago I got super ambitious about d.i.y interior  decorating, during a period of frustration  with the limited personality  of mass market stuff available at  everyone&#8217;s favorite chain stores  (also, I got a subscription to Ready  Made, which I&#8217;m sure had something  to do with it). As a part of this, I  tried my hand at quilting (why  not?). The first quilt I made was a fairly simple  patchwork quilt,  which turned out nice&#8230; however, I also found out that  even if you try  to make your own things, you&#8217;re still limited by the  also limited  personality of the textiles and fabrics found in everyone&#8217;s  favorite  chain fabric stores. So, it struck me that maybe going back to basics  and creating something unique not just with fabric and color, but with  composition, was the way to go.</p>
<div id="attachment_451" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-finished.jpg"><img class="size-large wp-image-451" title="duvet-finished" src="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-finished-435x326.jpg" alt="" width="435" height="326" /></a><p class="wp-caption-text">Finished!</p></div>
<p>Then, one day I stumbled upon this awesome art/type poster collection site called<a href="http://www.typographicposters.com"> typographicposters.com</a>, and saw a piece of work by the artist/designer <a href="http://www.typographicposters.com/#/benoit-bodhuin/">Benoit Bodhuin</a> (snarky note: I can&#8217;t link directly because it&#8217;s a flash site! *boo*), and the idea for this duvet cover was born. I did some fabric research, found some fairly thrifty <a href="https://www.fabric.com/ProductDetail.aspx?ProductID=aa558384-376b-414a-ae79-d26573602947">cotton broadcloth fabric</a> in solid colors from fabric.com, and got started in translating the graphic style of the posters to fabric form.</p>
<p>Since all the shapes are right-triangles, it&#8217;s fairly easy to recreate as a sewing/quilting pattern. I created a new Adobe Illustrator file, then made a grid of 3 inch squares, each square divided diagonally across both axes. From there, I filled in each part of the grid accordingly (see printed out version below)</p>
<div id="attachment_455" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-plan.jpg"><img class="size-large wp-image-455" title="duvet-plan" src="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-plan-435x563.jpg" alt="" width="435" height="563" /></a><p class="wp-caption-text">plan mocked up in Illustrator, then printed out with each sewing block outlined &amp; numbered</p></div>
<p>Next, I had to figure out how much fabric I needed for each color. This is probably the trickiest part, since you have to not only figure out how much yardage you need according to the design, but also factor in seam allowances and how to cut your squares to maximize use of each yard. Rather than try to do some fancy geometry maths, I just guestimated how many yards I&#8217;d need, and ended up running out of gray fabric toward the end (when I reordered, the gray was a slightly different hue than previously, so try to avoid this if at all possible). The finished size of the duvet cover needed to be 88&#8243;x88&#8243;, to fit the queen-sized comforter I already had. Since cutting and sewing so many little squares together inevitably leads to variations in my finished size by up to an inch, I planned to leave room around the edge for a white border that I could size accordingly once I had the bulk of the work done, to arrive at 88 inches exactly.</p>
<p>Everything after this point is just hours and hours and hours of cutting, measuring, and sewing. I <em>really</em> hate the cutting part, because not only is it super tedious, but it&#8217;s also the part where I&#8217;m most prone to slippage of the hand, uncorrectable errors, and wasted fabric. Having the right tools is extremely important, especially a rotary fabric cutter, and quilting ruler. Since I hate cutting so much, I decided it would be best to get it all done at the outset, kind of like eating brussel sprouts on your plate first so that you can enjoy the mashed potatoes at the end. I took a look at my design plan, then tallied up the amount of each size and color of fabric piece that I would need.</p>
<div id="attachment_456" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-fabric-tally.jpg"><img class="size-large wp-image-456" title="duvet-fabric-tally" src="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-fabric-tally-435x660.jpg" alt="" width="435" height="660" /></a><p class="wp-caption-text">Fabric cut pieces tally</p></div>
<p>Finally after all the fabric was cut, I started piecing together smaller blocks according to their block number in the plan, then pieced those blocks into bigger blocks, and so on until I had the finished front of the duvet cover. I measured and added a white border to the outside, then quilted the whole front (without batting (padding)) to another piece of fabric, to hide the seams. Finally, I sewed the back of the duvet cover on, with buttons on the end to slip the comforter in.</p>
<div id="attachment_457" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-section-org.jpg"><img class="size-large wp-image-457" title="duvet-section-org" src="http://www.thefourthstar.com/wp-content/uploads/2011/02/duvet-section-org-435x563.jpg" alt="" width="435" height="563" /></a><p class="wp-caption-text">Fabric needed for each block, as a guide and checklist</p></div>
<p>I couldn&#8217;t be happier with the final piece, and am totally excited about new variations on solid color patterns that I can make in the future &#8211; but it might be a while. After over 80 hours of planning, cutting, and sewing, I&#8217;m not about to jump right in again! All things put in perspective, those serious quilting hobbyists are crazier and more dedicated than any WOW player, in my book.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thefourthstar.com/2011/02/badass-duvet-cover-and-im-done-with-sewing-for-a-while/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>JS1k Xmas Demo Snowflake</title>
		<link>http://www.thefourthstar.com/2011/01/js1k-xmas-demo-snowflake/</link>
		<comments>http://www.thefourthstar.com/2011/01/js1k-xmas-demo-snowflake/#comments</comments>
		<pubDate>Sun, 02 Jan 2011 23:17:15 +0000</pubDate>
		<dc:creator>Cara McKinley</dc:creator>
				<category><![CDATA[Code]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.thefourthstar.com/?p=384</guid>
		<description><![CDATA[Disclaimer: this post may be something that only a serious internets/javascript/web dev nerd can appreciate. Starting in the early days of software development, the &#8216;demo&#8217; has been a way for a developer to show of his/her skills within a limited file size. In the summer of 2010, a javascript 1kb demo challenge was held to [...]]]></description>
			<content:encoded><![CDATA[<p>Disclaimer: this post may be something that only a serious internets/javascript/web dev nerd can appreciate. Starting in the early days of software development, the &#8216;demo&#8217; has been a way for a developer to show of his/her skills within a limited file size. In the summer of 2010, a javascript 1kb demo challenge was held to showcase the mad skills of participating developers, with a focus on using HTML 5&#8242;s canvas. If you&#8217;re slightly unfamiliar with technology, 1kb of file size is <em>really</em> small, like 1,024 characters small. In a word document, that would be the equivalent of a couple paragraphs.</p>
<p>Some of the demos created by participating developers are crazy impressive for being such small sizes. There are a lot of hacks and tricks that you can use to reduce the volume of code, including but not limited to compression with tools like Google Closure Compiler, creating one-character aliases for frequently used properties, defining multiple variables in one statement, and doing really naughty things like leaving semi-colons off of the last statement in every block. Each little bit(or byte) that you can shave off adds up to a lot in the end. For a really great walk-through of the first js1k challenge&#8217;s winning demo, see <a href="http://marijnhaverbeke.nl/js1k/" target="_blank">Marijn Haverbeke&#8217;s work</a>.</p>
<p>The first JS1k challenge was a big hit with the development community, so a <a href="http://js1k.com/2010-xmas/" target="_blank">second competition</a> was held during the holiday season, with a Christmas theme. I entered a little <a href="http://js1k.com/2010-xmas/demo/877" target="_blank">snowflake-maker demo</a> &#8211; simple, but weirdly addicting. Click around on the white &#8216;paper&#8217; wedge to draw shapes. Click on your starting point (noted with the little gray dot) to close a shape. Make as many cutout shapes as you want, and then click the button to make your flake! My original source code is below the screenshot (once compressed, the code is &lt;1k).</p>
<div id="attachment_385" class="wp-caption aligncenter" style="width: 445px"><a href="http://js1k.com/2010-xmas/demo/877"><img class="size-large wp-image-385" title="Picture 1" src="http://www.thefourthstar.com/wp-content/uploads/2011/01/Picture-1-435x436.png" alt="" width="435" height="436" /></a><p class="wp-caption-text">My snowflake creation.</p></div>
<p><strong>Source Code:</strong> (Click to expand)
<pre name="code" class="javascript:collapse">
<!doctype html>
<html>
	<head>

		<meta charset="utf-8" />
	</head>
	<body>
		<canvas></canvas>
		<script>
			var c = document.getElementsByTagName('canvas')[0];
			var b = document.body;
			var a = c.getContext('2d');
			c.width=w=c.height=h=600;
			q='#000';
			c.style.cssText='background:'+q+';cursor:pointer';
			M=Math;
			P=M.PI/180;
			z=1;

			//assign shortcodes to context properties
			// inspired by Marijn Haverbeke's usage
			for(x in a){
				a[x[0]+(x[6]||x[2])]=a[x]
			}
			/*
			commonly used shortcodes for this demo:
			fc = fillRect
			ce = clearRect
			ac = arc
			rc= rect
			sv= save
			re= restore
			sa= scale
			rt= rotate
			ta= translate
			ba = beginPath
			mv= moveTo
			ln= lineTo
			fl= fill
			sr= stroke
			cL= createLinearGradient
			cR= createRadialGradient
			ci= clip
			*/

			a.sv();

			// starting triangle
			a.ta(225,550);
			function t(){
				a.fillStyle='#fff';
				a.ba();
				a.ln(250*z,-433);
				a.ln(0,-500);
				a.ln(0,0);
				a.fl()
			}
			t();

			// cut shapes out on user click
			x=y=i=k=0;
			A=[];
			B=[];
			a.strokeStyle='#666';
			a.fillStyle=q;

			c.onclick=function(e){
				with(a){
					x=e.clientX-225;
					y=e.clientY-550;
					ba();
					m=A[0];
					n=A[1];
					if(x>m-7&#038;x<m+7&#038;y>n-7&#038;y<n+7){ // if click is on originating point, complete shape and fill polygon, store coordinates in array
						mv(m,n);
						for(j=0;j<A.length;j+=2){
							ln(A[j],A[j+1])						
						}
						fl();
						B[k]=A;
						k++;
						A=[]
					}

					else if(A==0){ // if click is first in polygon (array is empty), start new
						sr(ac(A[0]=x,A[1]=y,1,0,M.PI*2,0));
						i=2
					}

					else{ // add lines to current shape with each click
						sr(ln(A[i-2],A[i-1]),ln(A[i]=x,A[i+1]=y));
						i+=2
					}
				}
			}

			//buttons
				g='<button onclick="';
				p='</button>';
				document.write(''+g+'F()">Make a Flake!'+p+' '+g+'window.location.reload()">Clear'+p);

			// redraw user's created shape on smaller scale from stored array, reflect/rotate/repeat into full-on snowflake
			function F(){
				a.re();
				a.ce(0,0,h,w);
				a.ta(w/2,h/2);
				a.sa(.5,.5);

				setInterval(function(){ // slowly rotate completed snowflake, for a finishing touch
					with(a){
						ce(-h,-w,h*2,w*2);
						rt(.15*P);
						sv();

						for(m=0;m<2;m++){
							z=(m==1)?-1:1; // reflect shape on second runthrough by multiplying x-coordinates by -1
							for(n=0;n<6;n++){
								rt(60*P); // rotate
								t(); //draw triangle
								sv();
								for(j in B){
									fillStyle=q;
									ba();
									for(l=0;l<B[j].length;l+=2){ // redraw user's shapes
										ln(B[j][l]*z,B[j][l+1])						
									}
									fl()
								}
								re()
							}
						}

						re()
					}
				},30)

			}
		</script>
	</body>
</html>
</pre>
]]></content:encoded>
			<wfw:commentRss>http://www.thefourthstar.com/2011/01/js1k-xmas-demo-snowflake/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Dont&#8217; Call It &#8216;Expresso&#8217;</title>
		<link>http://www.thefourthstar.com/2010/06/dont-call-it-expresso/</link>
		<comments>http://www.thefourthstar.com/2010/06/dont-call-it-expresso/#comments</comments>
		<pubDate>Sat, 19 Jun 2010 23:17:57 +0000</pubDate>
		<dc:creator>Cara McKinley</dc:creator>
				<category><![CDATA[Digital Art]]></category>

		<guid isPermaLink="false">http://www.thefourthstar.com/?p=289</guid>
		<description><![CDATA[Several weeks ago Threadless, a Chicago-based company that prints t-shirts from community submitted artwork, posted a design challenge called &#8216;Threadless Loves Coffee&#8216;. Every month or so they create these design challenges, which usually involve a specific topic and some financial/material incentive from a third company. I don&#8217;t normally participate in design competitions since they are [...]]]></description>
			<content:encoded><![CDATA[<p>Several weeks ago <a href="http://www.threadless.com" target="_blank">Threadless</a>, a Chicago-based company that prints t-shirts from community submitted artwork, posted a design challenge called &#8216;<a href="http://www.threadless.com/loves/coffee" target="_blank">Threadless Loves Coffee</a>&#8216;. Every month or so they create these design challenges, which usually involve a specific topic and some financial/material incentive from a third company. I don&#8217;t normally participate in design competitions since they are a little too close to spec-work for my liking, but Threadless really supports its artistic community, and the participants are really getting a chance to make the artwork they enjoy and have a chance to get something for it, versus trying to provide services to a real client.</p>
<p>Since this design challenge was about loving coffee, I couldn&#8217;t pass it up, because&#8230; I really love coffee. It gave me a goal to work toward, and after coming up with some idea/sketches for an infograph, I went for it. I called on my 3 years&#8217; experience as a barista while in college, and created a conversation piece about making coffee the right way.</p>
<p style="text-align: center;">
<div id="attachment_290" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2010/06/coffee_poster.jpg"><img class="size-large wp-image-290 " title="coffee_poster" src="http://www.thefourthstar.com/wp-content/uploads/2010/06/coffee_poster-435x688.jpg" alt="" width="435" height="688" /></a><p class="wp-caption-text">Don&#39;t Call It &#39;Expresso&#39;</p></div>
]]></content:encoded>
			<wfw:commentRss>http://www.thefourthstar.com/2010/06/dont-call-it-expresso/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Crochet Tweed Handbag</title>
		<link>http://www.thefourthstar.com/2010/04/crochet-tweed-handbag/</link>
		<comments>http://www.thefourthstar.com/2010/04/crochet-tweed-handbag/#comments</comments>
		<pubDate>Sat, 24 Apr 2010 22:58:45 +0000</pubDate>
		<dc:creator>Cara McKinley</dc:creator>
				<category><![CDATA[Fiber Art]]></category>

		<guid isPermaLink="false">http://www.thefourthstar.com/?p=282</guid>
		<description><![CDATA[Just a little something that I finally pulled out of hibernation and finished, after starting a year ago. There is a pattern floating around on Ravelry.com called the &#8216;p.91 crochet bag&#8217;, which manages to make crochet into something really trendy (photo here of one made by Ravelry member Roko). Unfortunately, the pattern is from an [...]]]></description>
			<content:encoded><![CDATA[<p>Just a little something that I finally pulled out of hibernation and finished, after starting a year ago. There is a pattern floating around on Ravelry.com called the &#8216;p.91 crochet bag&#8217;, which manages to make crochet into something really trendy (photo <a href="http://www.flickr.com/photos/25934263@N04/2529953497/in/photostream/" target="_blank">here</a> of one made by Ravelry member Roko). Unfortunately, the pattern is from an out-of-print Japanese magazine and is unavailable to me. However, there is a similar pattern in <a href="http://www.amazon.com/Stitch-Bitch-Crochet-Happy-Hooker/dp/0761139850/ref=sr_1_1?ie=UTF8&amp;s=books&amp;qid=1272147433&amp;sr=8-1" target="_blank">Happy Hooker</a>, the &#8216;Fat Bottom Bag&#8217;, that has a similar look. I used the fat bottom bag pattern as a guide, and guessing some modifications where I could to make the bag look more like the p.91 crochet bag. To give the bag a little more structure, I also added a cotton lining with a pocket, hand-sewed in after piecing it together. Finally, I added a crochet flower detail to one side to add some romanticism.</p>
<p>I think a lot of crochet items have a 70&#8242;s craft project look to them, but I was really happy with the way this bag turned out. It has a vintage feel without looking cheap and fad-ish. Faddy? Fad-like.</p>
<div id="attachment_283" class="wp-caption aligncenter" style="width: 444px"><a href="http://www.thefourthstar.com/wp-content/uploads/2010/04/bag_front.jpg"><img class="size-large wp-image-283 " title="bag_front" src="http://www.thefourthstar.com/wp-content/uploads/2010/04/bag_front-434x468.jpg" alt="" width="434" height="468" /></a><p class="wp-caption-text">Finished bag</p></div>
<p style="text-align: center;">
<div id="attachment_284" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2010/04/bag_details.jpg"><img class="size-large wp-image-284  " title="bag_details" src="http://www.thefourthstar.com/wp-content/uploads/2010/04/bag_details-435x190.jpg" alt="" width="435" height="190" /></a><p class="wp-caption-text">Flower detail and inner lining</p></div>
<p style="text-align: center;">
]]></content:encoded>
			<wfw:commentRss>http://www.thefourthstar.com/2010/04/crochet-tweed-handbag/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Pillows To Heighten the Lounging Experience</title>
		<link>http://www.thefourthstar.com/2010/03/pillows-to-heighten-the-lounging-experience/</link>
		<comments>http://www.thefourthstar.com/2010/03/pillows-to-heighten-the-lounging-experience/#comments</comments>
		<pubDate>Sat, 13 Mar 2010 22:30:57 +0000</pubDate>
		<dc:creator>Cara McKinley</dc:creator>
				<category><![CDATA[Needle & Thread]]></category>

		<guid isPermaLink="false">http://www.thefourthstar.com/?p=273</guid>
		<description><![CDATA[When you live in a small loft apartment, the majority of surfaces are unsuitable for lounging &#8211; large expanses of concrete and brick and little space for such luxuries as recliners and large sofas. And in the case of Austin&#8217;s apartment, seating is limited to a single futon with wooden arm rests. Frequent were the [...]]]></description>
			<content:encoded><![CDATA[<p>When you live in a small loft apartment, the majority of surfaces are unsuitable for lounging &#8211; large expanses of concrete and brick and little space for such luxuries as recliners and large sofas. And in the case of Austin&#8217;s apartment, seating is limited to a single futon with wooden arm rests. Frequent were the occasions when I&#8217;d find myself trying to lean to one side of the futon to watch a movie or read a book, only to find no soft welcoming reception or warm cushy support. This, obviously, had to change. Fortunately, my new sewing machine has given me the power to heighten this lounging experience by making some pillows for Austin.</p>
<p>Pillows are so easy to make! Each one was done in a night, if not a couple hours. The first pillow (left) is a solid fabric cut into strips than sewed back into a rectangle, with a few strips replaced with a patterned fabric. The second pillow is a&#8230;pinwheel? design with a fabric button in the center. I mulled over the best strategy for sewing the triangles together, and had a eureka moment when I found this <a href="http://aquiltisnice.blogspot.com/2008/09/zig-zag-quilt-kit-tutorial.html" target="_blank">quilting tutorial</a> &#8211; creating triangles is actually a piece of cake, and this pillow took me the least amount of time. The third pillow features a cool optical pattern framed by neutral stripes with mitered corners. Each pillow was planned as a single piece, so they don&#8217;t really work so well together as a set, and they&#8217;re pretty basic. On the next run I&#8217;ll probably get more ambitious with the planning and design.</p>
<p style="text-align: center;">
<div id="attachment_274" class="wp-caption aligncenter" style="width: 445px"><a href="http://www.thefourthstar.com/wp-content/uploads/2010/03/20100313_austin_pillows.jpg"><img class="size-large wp-image-274  " title="20100313_austin_pillows" src="http://www.thefourthstar.com/wp-content/uploads/2010/03/20100313_austin_pillows-435x326.jpg" alt="" width="435" height="326" /></a><p class="wp-caption-text">Some Simple Pillows.</p></div>
<p>All fabrics came from <a href="http://www.fatquartershop.com/" target="_blank">Fat Quarter Shop</a>, an online quilting fabric store which so far has been the best variety I have found (unfortunately for local shops, which I would love to give business to, but the St. Louis area shops I&#8217;ve been to are pretty lacking in variety and searchability, which becomes really limiting to your designs).</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thefourthstar.com/2010/03/pillows-to-heighten-the-lounging-experience/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

