--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/DESIGN.mdown Wed Jan 06 21:17:38 2010 -0500
@@ -0,0 +1,6 @@
+Some notes on the design, mostly for myself.
+
+Images
+======
+
+Full images for posts should be 600 pixels wide (or less).
\ No newline at end of file
--- a/content/blog/2008/04/shooting-girl-jam.html Wed Jan 06 20:14:42 2010 -0500
+++ b/content/blog/2008/04/shooting-girl-jam.html Wed Jan 06 21:17:38 2010 -0500
@@ -9,7 +9,12 @@
{% block article %}
-<a href="http://www.flickr.com/photos/sjl7678/2450406138/" title="GirlJamSaturday-5383 by Steve Losh, on Flickr"><img src="http://farm4.static.flickr.com/3009/2450406138_473b84b17b_m.jpg" width="240" height="161" alt="GirlJamSaturday-5383" class="blog-photo-inline-left" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2450406138/"
+ title="GirlJamSaturday-5383 by Steve Losh, on Flickr">
+ <img src="http://farm4.static.flickr.com/3009/2450406138_473b84b17b_m.jpg"
+ width="240" height="161" alt="GirlJamSaturday-5383"
+ class="left" />
+</a>
This past weekend (April 25-28) was [Northeast Girl Jam][] in Rochester, New
York. Girl Jam is a swing dancing workshop weekend that focuses on classes for
@@ -31,7 +36,12 @@
energy in the room. I started playing with this technique at the blues parties
in the past and I think I'm really starting to get the hang of it.
-<a href="http://www.flickr.com/photos/sjl7678/2449562969/" title="GirlJamFriday-4873 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2349/2449562969_68c82066e8_m.jpg" width="161" height="240" alt="GirlJamFriday-4873" class="blog-photo-inline-left" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2449562969/"
+ title="GirlJamFriday-4873 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2349/2449562969_68c82066e8_m.jpg"
+ width="161" height="240" alt="GirlJamFriday-4873"
+ class="left" />
+</a>
On Friday I only had one of my flashes with me, so I had to make some
tradeoffs. I bounced the flash from the ceiling to get more even lighting
@@ -43,7 +53,12 @@
was shot at ISO 3200 and I don't think the noise distracts from the image much
at all.
-<a href="http://www.flickr.com/photos/sjl7678/2449565301/" title="GirlJamFriday-4943 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2186/2449565301_e2491e6b7a_m.jpg" width="240" height="161" alt="GirlJamFriday-4943" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2449565301/"
+ title="GirlJamFriday-4943 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2186/2449565301_e2491e6b7a_m.jpg"
+ width="240" height="161" alt="GirlJamFriday-4943"
+ class="right" />
+</a>
I was using a wide angle lens (18mm) so that I could get entire bodies into
the frame. One of the things I love about Lindy Hop is that it really uses the
@@ -53,7 +68,12 @@
focus at 18mm. I set the shutter speed depending on the amount of ambient
light; it varied from 1/30 to 1/4 or so.
-<a href="http://www.flickr.com/photos/sjl7678/2450392386/" title="GirlJamFriday-5007 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2410/2450392386_a61067e07f_m.jpg" width="161" height="240" alt="GirlJamFriday-5007" class="blog-photo-inline-left" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2450392386/"
+ title="GirlJamFriday-5007 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2410/2450392386_a61067e07f_m.jpg"
+ width="161" height="240" alt="GirlJamFriday-5007"
+ class="left" />
+</a>
The trick that really made a difference in taking good photos is that once I
set the exposure I stopped looking at the camera entirely. I didn't review my
@@ -78,7 +98,12 @@
light, which means I can shoot with recycle times twice as fast and have more
even light coverage.
-<a href="http://www.flickr.com/photos/sjl7678/2450405794/" title="GirlJamSaturday-5379 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2227/2450405794_940545d63d_m.jpg" width="161" height="240" alt="GirlJamSaturday-5379" class="blog-photo-inline-left" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2450405794/"
+ title="GirlJamSaturday-5379 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2227/2450405794_940545d63d_m.jpg"
+ width="161" height="240" alt="GirlJamSaturday-5379"
+ class="left" />
+</a>
Since I was able to shoot twice as many photos I was able to experiment with
getting up close. Using a wide angle lens let me get most of the dancers in
@@ -91,15 +116,23 @@
focus of this picture. As long as you don't underexpose noise is usually not a
problem in these kind of photos.
-<a href="http://www.flickr.com/photos/sjl7678/2450404742/" title="GirlJamSaturday-5349 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2256/2450404742_3d9a3df777_m.jpg" width="161" height="240" alt="GirlJamSaturday-5349" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2450404742/"
+ title="GirlJamSaturday-5349 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2256/2450404742_3d9a3df777_m.jpg"
+ width="161" height="240" alt="GirlJamSaturday-5349"
+ class="right" />
+</a>
Not only did I try getting up close, I also tried varying my angle more than I
usually do. I usually brace the camera against my ribs when taking these kinds
of photos for a few reasons:
* It's a safe height that will get the whole dancer in the frame.
-* My ribs are vertical and so aligning the camera with them means that it's not wildly tilted up or down and I don't accidentally get ceiling- or floor-only photos.
-* It keeps the camera close to my body where it's much less likely to be whacked by a stray limb.
+* My ribs are vertical and so aligning the camera with them means that it's
+ not wildly tilted up or down and I don't accidentally get ceiling- or
+ floor-only photos.
+* It keeps the camera close to my body where it's much less likely to be
+ whacked by a stray limb.
Getting lower and higher gives me different perspectives that can have really
nifty results. The problem is that it's much harder to know if the subject is
@@ -114,7 +147,12 @@
Sunday
-------
-<a href="http://www.flickr.com/photos/sjl7678/2449592347/" title="GirlJamSunday-5647 by Steve Losh, on Flickr"><img src="http://farm4.static.flickr.com/3066/2449592347_6a17602cd9_m.jpg" width="161" height="240" alt="GirlJamSunday-5647" class="blog-photo-inline-left" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2449592347/"
+ title="GirlJamSunday-5647 by Steve Losh, on Flickr">
+ <img src="http://farm4.static.flickr.com/3066/2449592347_6a17602cd9_m.jpg"
+ width="161" height="240" alt="GirlJamSunday-5647"
+ class="left" />
+</a>
On Sunday I shot at a few of the workshops since there wasn't a dance. A
workshop has a very different feeling than a dance and so I didn't want to try
@@ -127,7 +165,12 @@
well as this picture shows. The shutter speed is just slow enough to get some
blur at the ends of the limbs but not enough to lose all detail.
-<a href="http://www.flickr.com/photos/sjl7678/2449590741/" title="GirlJamSunday-5512 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2076/2449590741_b47a5ced4c_m.jpg" width="161" height="240" alt="GirlJamSunday-5512" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2449590741/"
+ title="GirlJamSunday-5512 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2076/2449590741_b47a5ced4c_m.jpg"
+ width="161" height="240" alt="GirlJamSunday-5512"
+ class="right" />
+</a>
Since I was using a normal lens instead of a wide angle I had to mostly
abandon the idea of getting big group photos and instead try to capture
--- a/content/blog/2009/02/how-i-shoot-dances.html Wed Jan 06 20:14:42 2010 -0500
+++ b/content/blog/2009/02/how-i-shoot-dances.html Wed Jan 06 21:17:38 2010 -0500
@@ -63,7 +63,12 @@
I've tried a couple of different techniques to overcome these problems. Some
of them work in some situations but most of the time they leave me unhappy.
-<a href="http://www.flickr.com/photos/sjl7678/2449590741/" title="GirlJamSunday-5512 by Steve Losh, on Flickr"><img src="http://farm3.static.flickr.com/2076/2449590741_b47a5ced4c_m.jpg" width="161" height="240" alt="GirlJamSunday-5512" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/2449590741/"
+ title="GirlJamSunday-5512 by Steve Losh, on Flickr">
+ <img src="http://farm3.static.flickr.com/2076/2449590741_b47a5ced4c_m.jpg"
+ width="161" height="240" alt="GirlJamSunday-5512"
+ class="right" />
+</a>
### Fast Primes, High ISO
@@ -103,7 +108,12 @@
bad, but I've grown to really love wide angle lenses. 50mm feels too far and
detached for my taste. Yours may be different, so give it a try.
-<a href="http://www.flickr.com/photos/sjl7678/3256610463/" title="LindyJam-0095 by Steve Losh, on Flickr"><img src="http://farm4.static.flickr.com/3400/3256610463_5465877459_m.jpg" width="181" height="240" alt="LindyJam-0095" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3256610463/"
+ title="LindyJam-0095 by Steve Losh, on Flickr">
+ <img src="http://farm4.static.flickr.com/3400/3256610463_5465877459_m.jpg"
+ width="181" height="240" alt="LindyJam-0095"
+ class="right" />
+</a>
### Bounced Flash, Max Sync Speed
@@ -163,7 +173,12 @@
"Why is that?" The photos were exposed well and aside from the focusing
mishaps were pretty sharp. What was missing?
-<a href="http://www.flickr.com/photos/sjl7678/299107896/" title="CIMG0171.JPG by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/120/299107896_fbec7e2df7_m.jpg" width="240" height="155" alt="CIMG0171.JPG" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/299107896/"
+ title="CIMG0171.JPG by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/120/299107896_fbec7e2df7_m.jpg"
+ width="240" height="155" alt="CIMG0171.JPG"
+ class="right" />
+</a>
Eventually I came up with my answer: "Movement." Lindy Hop is very much about
movement; it's one of the most important parts of the dance, maybe even *the*
@@ -179,7 +194,12 @@
(because point and shoot cameras in their default modes are just not equipped
to take sharp ones).
-<a href="http://www.flickr.com/photos/sjl7678/299107792/" title="CIMG0141.JPG by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/118/299107792_0b4907245f_m.jpg" width="240" height="180" alt="CIMG0141.JPG" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/299107792/"
+ title="CIMG0141.JPG by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/118/299107792_0b4907245f_m.jpg"
+ width="240" height="180" alt="CIMG0141.JPG"
+ class="right" />
+</a>
Even with their flaws, *we love them* because they're the few photographic
memories we have of some of the best nights of our lives.
@@ -199,7 +219,12 @@
we know that "blurry photograph" usually means "moving subject" even if we're
not always 100% clear on the physics of it.
-<a href="http://www.flickr.com/photos/sjl7678/3264591984/" title="GW-0453 by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/250/3264591984_296047fb19_m.jpg" width="181" height="240" alt="GW-0453" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3264591984/"
+ title="GW-0453 by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/250/3264591984_296047fb19_m.jpg"
+ width="181" height="240" alt="GW-0453"
+ class="right" />
+</a>
As photographers, we know what causes it. A subject moving while the shutter
is open produces blur. Longer shutter speeds mean more blur. The little
@@ -224,7 +249,12 @@
* **An external flash.** I use an $80 Vivitar 285hv which will work with anything, so no complaining about how your camera maker only sells $400 speedlights.
* **A way to sync your flash with the camera.** Some of the more expensive flashes have a wireless mode. If not, you can buy radio triggers for $60 or so, or buy a sync cable for $15 to $20. Trust me, having the flash *off* of the camera makes things so much easier.
-<a href="http://www.flickr.com/photos/sjl7678/3264540604/" title="GW-0290 by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/195/3264540604_f4665b50e6_m.jpg" width="240" height="181" alt="GW-0290" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3264540604/"
+ title="GW-0290 by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/195/3264540604_f4665b50e6_m.jpg"
+ width="240" height="181" alt="GW-0290"
+ class="right" />
+</a>
#### Step 1 – Dial in the Flash
@@ -253,7 +283,12 @@
the shutter speed until you're about two stops underexposed; it will be blurry
and dark as hell but this is what you want right now.
-<a href="http://www.flickr.com/photos/sjl7678/3263800481/" title="GW-0580 by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/196/3263800481_9ebf0a47f3_m.jpg" width="240" height="181" alt="GW-0580" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3263800481/"
+ title="GW-0580 by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/196/3263800481_9ebf0a47f3_m.jpg"
+ width="240" height="181" alt="GW-0580"
+ class="right" />
+</a>
#### Step 3 – Combine and Adjust
@@ -275,7 +310,11 @@
mention. First I'll talk about the typical problems you'll see right away.
More than one of these certainly might apply; fix them one at a time.
-<a href="http://www.flickr.com/photos/sjl7678/3263819663/" title="GW-0656 by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/192/3263819663_4f97c18da4_m.jpg" width="181" height="240" alt="GW-0656" class="blog-photo-inline-right" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3263819663/"
+ title="GW-0656 by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/192/3263819663_4f97c18da4_m.jpg"
+ width="181" height="240" alt="GW-0656"
+ class="right" /></a>
* **If the background is dark or there is not enough blur,** you need to use a longer shutter speed to let more ambient light in.
* **If the dancers are not sharp enough,** you need *more* flash power. Turn it up a little bit at a time.
@@ -303,6 +342,10 @@
Now go dance, have fun, and make beautiful photographs so we can all remember
the fantastic events we make happen!
-<a href="http://www.flickr.com/photos/sjl7678/3263760493/" title="GW-0438 by Steve Losh, on Flickr"><img src="http://farm1.static.flickr.com/196/3263760493_08c525cfe7.jpg" width="500" height="377" alt="GW-0438" /></a>
+<a href="http://www.flickr.com/photos/sjl7678/3263760493/"
+ title="GW-0438 by Steve Losh, on Flickr">
+ <img src="http://farm1.static.flickr.com/196/3263760493_08c525cfe7.jpg"
+ width="500" height="377" alt="GW-0438" />
+</a>
{% endblock %}
\ No newline at end of file
--- a/content/blog/2009/08/a-guide-to-branching-in-mercurial.html Wed Jan 06 20:14:42 2010 -0500
+++ b/content/blog/2009/08/a-guide-to-branching-in-mercurial.html Wed Jan 06 21:17:38 2010 -0500
@@ -8,7 +8,7 @@
{% block article %}
-<div class="no-img-borders">
+<div class="with-diagrams">
I've been hanging out in the [#mercurial][hg-irc] and [#bitbucket][bb-irc]
channels on freenode a lot lately, and I've noticed a topic that comes up a
--- a/content/projects/fuego.html Wed Jan 06 20:14:42 2010 -0500
+++ b/content/projects/fuego.html Wed Jan 06 21:17:38 2010 -0500
@@ -9,14 +9,12 @@
{% block article %}
<div class="gallery">
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-4852.jpg" />
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-4887.jpg" />
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-4919.jpg" />
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-4941.jpg" />
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-4985.jpg" />
- <img src="/media/images/projects/{{ page.page_name }}/Fuego-5133.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-4852.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-4887.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-4919.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-4941.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-4985.jpg" />
+ <img src="/media/images/projects/{{ page.page_name }}/Fuego-5133.jpg" />
</div>
-I really like how these turned out. One of them is hanging in my apartment.
-
{% endblock %}
\ No newline at end of file
--- a/media/css/base.css Wed Jan 06 20:14:42 2010 -0500
+++ b/media/css/base.css Wed Jan 06 21:17:38 2010 -0500
@@ -195,3 +195,42 @@
}
/* Image styles. */
+div.with-diagrams img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ background: none;
+ border: none;
+}
+div#leaf-content img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ border: 1.43em solid #e5e5e5;
+ padding: 1px;
+ background: black;
+}
+div#leaf-content img.left, div#leaf-content img.right {
+ border: none;
+ background: none;
+ padding: none;
+}
+div#leaf-content img.left {
+ margin: 0 1.5em 1em 0;
+}
+div#leaf-content img.right {
+ margin: 0 0 .75em 1em;
+}
+div#leaf-content div.gallery > img {
+ display: inline;
+ padding: 0px;
+ border: none;
+ margin-left: 0px;
+ margin-right: 0px;
+}
+div#leaf-content div.gallery-pane {}
+div#leaf-content div.gallery-pane img.gallery-display {
+ display: block;
+ margin: 0px;
+ padding: 0px;
+}
\ No newline at end of file
Binary file media/images/blog/2009/02/dj-playlist-sorting.png has changed
Binary file media/images/blog/2009/02/dj-playlist-unrated.png has changed
--- a/media/js/sjl-gallery.js Wed Jan 06 20:14:42 2010 -0500
+++ b/media/js/sjl-gallery.js Wed Jan 06 21:17:38 2010 -0500
@@ -6,21 +6,22 @@
var cols = 4;
var padding = 10;
- var total_width = $(this).width();
- var width = (total_width / cols) - 2 * padding;
+ var total_width = $(this).width() - (cols * 2 * padding);
+ var width = (total_width / cols);
+
$(this).find('img').css({width: width, margin: padding});
$(this).before('<div class="gallery-pane"></div>');
$(this).find('img:first').clone()
.addClass('gallery-display')
- .css({width: '', margin: ''})
+ .css({width: '', margin: '0px auto'})
.appendTo('div.gallery-pane');
});
-
+
$('div.gallery img').click(function() {
var new_image = $(this).clone()
.addClass('gallery-display')
- .css({width: '', margin: '', display: 'none'});
+ .css({width: '', margin: '0px auto', display: 'none'});
$('img.gallery-display').fadeOut('fast', function() {
$(this).remove();
new_image.appendTo('div.gallery-pane').fadeIn('slow');
