Skip to content

Ecce Signum

Immanentize the Empathy

  • Home
  • About Me
  • Published Works and Literary Matters
  • Indexes
  • Laboratory
  • Notebooks
  • RSS Feed

Turning Photos Into 3D Models

2011-07-19 John Winkelman

Wooden duck model for AutoDesk PhotoFly

Click here to see the duck in action.

The hollow spinning duck is the result of a couple of years of contemplation and about a day and a half of work. Back in 2007 Blaise Aguera y Arcas introduced Photosynth at TED.com. Photosynth generates 3d-ish scenes from groups of photos, and one of the artifacts of this process is a point cloud which indicates all of the points of similarity between the multiple photos. Given enough photos, and enough information in each photo, the point cloud begins to resemble a 3d rendering of the subject of the photos.

The brilliant folks over at AutoDesk Labs have taken this concept one step further and created a tool which generates an actual 3d model of a scene. They call it Project Photofly, and it includes the simple-yet-amazing Photo Scene tool.

Basically, this is how it works: Pick something to photograph. This can be an object, a room, a person, or a location. Take many overlapping photos from several angles and heights. Load those photos into the Photo Scene tool. Sit back and wait as the photos are uploaded to the online portion of the tool, where all of the heavy computing takes place. Once finished, download the 3d object back into the Photo Scene tool, edit as necessary, and then render or save the result. Skaboom. Instant (ish) 3d model from a series of photos.

For my project, creating the 3d object was only half of the work. The other half was getting it to render in Flash. Fortunately, there is a powerful, easy-to-learn (again, “-ish”) Actionscript library called Away3d which can import and render a wide variety of 3d file formats. Unfortunately, the documentation is somewhat fragmented, due in part to the release of version 4 of Away3d, which targets the Flash 11 player, which is still in Beta. I am using Away3d version 3.6, and examples thereof are rapidly being replaced by newer versions.

Two books saved me: Away3d 3.6 Essentials and Away3d 3.6 Cookbook. They recommended that I take the model as produced by Photo Scene and run it through a processing tool called PreFab, which is used to pre-process 3d models to optimize them for use in any of the Flash 3d engines.

Five minutes later, I had a spinning duck.

The file size, however, was problematic. 1,200k for a single 3d model is not unreasonable, but it seemed excessive for the simple object I was using. As luck would have it, the textures generated by Photo Scene are contained in a single gigantic .jpg file, so I opened it in GIMP, reduced the quality to about 50%, and resaved at a little over 300k. I am sure I could have done more, but this was sufficient for my first model.

This group of tools excites me. The ability to make web-ready 3d models with nothing more than a camera and a couple of free tools opens a great many doors for developers and clients who do not have the resources to run a full 3d rendering farm. Textures are de facto photo quality, and file size can be manipulated to find the sweet spot between visual quality and download speeds.

My summer just got a lot more interesting.

So to recap: Here are the tools I used to create the duck. All are free (except the camera).

1. A camera
2. AutoDesk Photo Scene Editor for creating and editing the 3d model
3. Prefab for optimizing the 3d model
4. GIMP for modifying the model textures
5. Flex SDK for compiling the Flash movie

Now that I have the tools sorted out I will work on optimizing the workflow. I want to see if I can get it down to one hour from initial photo to final output. Expect to see many more of these in the near future.

Posted in PhotographyTagged photogrammetry, Photosynth comment on Turning Photos Into 3D Models

Four Weeks Later

2011-06-27 John Winkelman

So here I am, unemployed for a month. Just got word that earlier today, four more people were let go by my former employer. So that is five of us, pounding the pavement, chasing after the almighty dollar. I have had some luck; got some contract work early on, and meeting with some folks over the next couple of weeks. I still haven’t finished the paperwork for unemployment; psychologically, it feels like that would be acknowledging something I don’t quite want to acknowledge yet.

In my free time I have been reading a lot, and spending more time with my girlfriend, and taking care of things around the house. My days have been surprisingly full, actually, and it makes me wonder how I ever managed while I was working 45-60 hours a week. In the last ten days I think I have got a full eight hours of sleep at least three times. Last time I did that was, umm…college, I think, when sleeping in until 1 in the afternoon on a Tuesday was a point of pride.

The one serious project I have completed so far has been to move the website for From the Heart Yoga over to Drupal Gardens. That’s right; the CMS which caused me such grief over the past year is now my go-to solution for almost any standard website I might be called upon to build. I actually learned a few interesting technical things, which will be the subject of upcoming blog posts of the “I had to figure this out for myself; here are my notes so you don’t have to” type.

Other than the lack of health insurance, I would/could comfortably do this for a long time. Except…

Except…

There are a lot of other people out there who are also unemployed, or under-employed, and who do not have the prospects I do, and to whom I feel obligated. I have a lot of friends who are hurting right now, and, if I can’t actually get them back on their feet, I feel that I should get myself back up and running so that I am in a better position to help them if the need should arise. What kind of friend would I be if I have the opportunity to help someone else, and deliberately put myself in a position where I can’t?

Yeah, having time to think has definitely broadened my horizons.

Posted in Life comment on Four Weeks Later

My First Photosynth

2011-05-28 John Winkelman

If you don’t see anything cool above this sentence, you probably need to install the Silverlight plugin.

If you still can’t see anything, try viewing the synth directly at my page on Photosynth.net

Got it? Good.

What you see above is a “Synth” of the fish ladder on the Grand River, just north of downtown Grand Rapids, Michigan. I created it using Photosynth, a piece of software created by the brilliant folks at the University of Washington and Microsoft.

In a nutshell, here is how it works: Find an interesting object. This could be a building, a car, the space shuttle, someone sitting still, or anything else which is not moving. Take lots and lots of photos of that object, from many different angles and elevations, all around the object. You will probably want to take at least a dozen, and a few hundred is not unreasonable. Once you have your photos, import them into the Photosynth desktop client (Windows only, for the moment), and go make a sandwich. This part takes a while.

Once the tool is done synthesizing the photos, it will give you a link to your page on Photosynth.net where you can interact with your new synth. All the instructions for viewing are there on the page if you click the “?”. You can see the scene as a series of 2d slides, in 3d space, as a top view, or as a point cloud.

As you click around you will see that there are a couple of glitches in the viewing experience. As near as I can tell, this is because of two problems with using the fish ladder as the subject of a synth.

First, I couldn’t get photos from every angle, all the way around the structure. There were large degree arcs where I could only see part of one side of the sculpture, and others where I could only see the sculpture from up close, with no surroundings in the photos to provide context.

Second, the structure is hollow, and from many different angles the interior walls are visible. I think that the software became a little confused when trying to match up specific shapes on the photos, when it was not clear if I was inside the sculpture looking out through a doorway, or outside looking in. The fish ladder is uniform gray concrete, with many non-right-angle surface intersections. Photosynth does a good job of mapping points of interest onto a 3d space, but I think that shapes which are different at one level of zoom, but similar at another, cause it to take a “best guess”, which isn’t always right. Example: The corner of a doorway, viewed from straight ahead, is a 90 degree angle. Viewed from directly in front, looking up, it is closer to 45 or 60 degrees. Now find another part of the sculpture where two walls come together at 60 degrees. And make it all uniformly gray concrete.

On the other hand, if you like non-Euclidean experiences, maybe this isn’t a problem.

For a good overview of Photosynth in action, see this video:

Demo of Photosynth at TED

Posted in PhotographyTagged Photosynth comment on My First Photosynth

The Psychology of the Freshly Unemployed

2011-05-27 John Winkelman

Here it is, five days in. I picked up a couple of hours of contract work yesterday, which was nice. Trying to get my head into the game today. The constant rain makes me want to go back to bed. I have a couple of dozen projects which are half-completed, several of which I could get done by the end of the week. I have a few new skill sets I need to work on (mobile web, Android app development, AIR development, augmented reality), but I can feel myself beginning to succumb to option paralysis.

My instincts tell me I am still a full-time worker, and that I am home during the late morning hours means I am either on vacation or this is the weekend. This triggers my “I’ve done enough work this week” reflex, which makes it more difficult to want to spend time in front of the computer. Another oddity is that I am unemployed, but everyone in my peer group is working right now. I am out of synch with the greater part of my life.

Today I am cleaning up my house; clearing off surfaces and removing distractions. Every space can be put to use as a place to think, or meditate, or reflect. Or play. I have discovered that the TV show NUMB3RS is surprisingly inspiring, mostly because the obsessive-compulsive geek part of me can identify with Charlie Eppes.

I also applied for unemployment yesterday, which was the first work-related thing in the past week which has felt “real”. If I have the numbers figured correctly – and it’s a big “if” – unemployment should cover all of my expenses for the next few months, which means I will have time to learn some new skills and do some serious networking. Suddenly being a contractor/freelancer is a lot more appealing. Two years ago this would have been devastating. Now it is kind of invigorating.

Posted in Life comment on The Psychology of the Freshly Unemployed

My Toolkit

2011-05-25 John Winkelman

I spent my tax returns this year on a new laptop. Specifically, a 16″ Sony Vaio, with a 1.73 GHz Intel I7 processor, 4 gigs of ram, a 500GB hard drive, and a mobile video card with 1Gb of onboard RAM, pushing a display with 1920×1080 full HD resolution. My desktop PC, a stupendous bad-ass of a gaming/development rig, is about five years old. In fact, it was the first thing I bought when I started my recent ex-job. While still a fine machine, it is not so good for freelancing or contract work as I can’t take it with me to different job sites. Now that I am between jobs, it seems appropriate that I spend my suddenly available time setting up the new machine as a money-making tool. At worst, I hope to make enough money with it to pay for it.

The great thing about the type of development I do is that all of the tools I need are free. So here they are, roughly categorized:

General Web Development
Notepad++ – my favorite text editor. Been using it for about six years, since Bock turned me on to it.
I.E. Tester – Tool which allows users to test their web sites in multiple versions of Internet Explorer. You can see how your work looks in seven(!) different versions of IE, if you choose.
FileZilla – easy-to-use FTP client
XAMPP – one-click installer for an AMP (Apache, MySQL, PHP) stack.
Drupal Gardens – A web host which specializes in Drupal 7. Basic accounts are free, but full-featured, and make great test environments.

Flash
Adobe Flex SDK – open-source compiler for Flash and Flex projects
Adobe AIR SDK – Tool kit for developing AIR applications
Adobe Pixel Bender Toolkit – specialized tool for advanced image manipulation

Mobile
Eclipse – Java development environment
Android SDK – bundle of tools for developing and testing applications for Android phones
Appcelerator Titanium – Andy turned me on to this one; it’s a tool kit for developing mobile and desktop applications.

Artistic and Media
Miro Video Converter – easily converts video files between multiple different formats. Especially useful for web-based video.
Audacity Audio Editor – great tool for editing and manipulating sound files
Picasa – Photo storage, cataloging, and editing
GIMP – open-source Graphics program, in the same family as Photoshop
Blender – 3d model creation, animation, and exporting
Processing – Java-based tool for creating abstract art. Can also be used to create Java applications
Inform 7 – The Inform system is used to create text adventure games (think Zork, or Leather Goddesses from Phobos) using natural language both to create the games and play them.
Photosynth – awesome tool which can stitch photographs together into a 3d model or scene.
Google Earth Google’s virtual model of the Earth
Flickr – Where I keep all of my photos. 16,000 and increasing every day.

Writing, Management, Documentation
Google Docs – If you have a gmail account, you get this for free. Word processing, spreadsheet, and much more.
Open Office – Free, open-source alternative to Microsoft Office.

I will update this list as I discover new or alternate tools.

Posted in Life comment on My Toolkit

Day 2

2011-05-24 John Winkelman

…it’s not that I’m worried about finding work, or making money. It’s more a sense of bewilderment. Though I have expected this day for over a year, and have been preparing things for the eventuality, actually walking through that door was a bit of a shock. I have abruptly gone from too much to do in too little time, to the opposite – all the time in the world, and no clue what I am going to do with it. Not having the pressure of a restricted schedule makes lessens the drive to make efficient use of any given moment.

Back at the beginning of the year I made a list of about thirty chores and small jobs which could reasonably be accomplished in about fifteen minutes. Given two hours of free time a day, fifteen minutes is a lot of time. With sixteen hours or more a day, yeah, fifteen minutes is fifteen minutes.

This is the third job in 23 years from which I have been let go. The first one was a produce factory in Eaton Rapids. I was a green-season employee, took a sick day, and was fired the next day. A couple of years later I spent a few weeks working as a landscaper. Started fun, ended badly when the company went out of business. Such is life.

I think my first act will be to spend a week clearing my head. Next week I will start making decisions.

Posted in LifeTagged work comment on Day 2

Lindenmayer System Basics: More on Branches

2011-03-31 John Winkelman

This post is one of a series exploring the creation of Lindenmayer System patterns using my Lindenmayer System Explorer.

The introduction of branching into our patterns, which we explored in my previous post, allows for a near infinite variety of designs. Often these pattens come remarkably close to the patterns seen in plant growth. In order to provide some realism to the patterns, there are a few more options in the explorer which are only available when creating branches: Line Scale, Line Taper, Angle Increment, and the option of using multiple colors.

Line Scale modifies the length of individual line segments. Line taper modifies the width of line segments. Angle Increment adjusts the angle that a branch is drawn from its parent.

The following images illustrate how each modification works. Clicking on an image will take you to the explorer pre-configured to recreate that image.

Start with this basic tree shape:

Now change the Line Scale to .75. You should end up with this:

Each branch is 75% of the length of its parent. This can be any number greater than 0. For branches twice the length of their parents, set the value to 2. For half as long, set it to .5.

For line thickness, update the line width so that it is something like 10:

Now change the Line Taper to .75:

Each branch is 75% of the thickness of its parent. You can use any number greater than 0. For instance, to have each branch twice as thick as its parent, you would set this field to 2. For half as thick, you would set it to .5.

Now change the Angle Increment to 10:

The angle of each branch from its parent is 10 degrees greater than that of the preceding branching. This can be any positive or negative number, though they will always evaluate to a value between -360 and 360.

Finally, you can use multiple colors, which are applied at each branching, by creating a comma-separated list of hexadecimal color numbers. This will have the following effect:

As the pattern is rendered, at each branch the next color in the list is used.

You can use any hexadecimal color you would like, and use as many as you would like.

So that, along with the previous post, is Lindenmayer System branches, in a nutshell. Enjoy!

Posted in ProgrammingTagged Flash, Lindenmayer, procedural art comment on Lindenmayer System Basics: More on Branches

Lindenmayer System Basics: Branches

2011-03-13 John Winkelman

This is the fifth in a series of blog posts explaining the usage of the Lindenmayer System Explorer. Clicking on an image will take you to the explorer page, pre-configured to draw that image.

So far, we have seen many different patterns created with the L-system explorer – fractals, dragon curves, snowflakes, and so on. They all have one thing in common: they are made up of a single line.

No branching yet

To create branches, enclose the rules for a branch in square brackets, like so:

[F]+[F]+[F]

Instead of yielding a bent line, it creates a pattern like this:

Branches, 1 iteration

Not terribly interesting yet, but it does allow for the creation of more interesting shapes. Remember: Astrid Lindenmayer was a botanist, and he originally created this system to model the structure of living plants. If we nest a few brackets, and play around with the angles, we can get patterns like this:

Something like a shrub

Branch rules can be nested within each other, to the extent that extremely complex patterns can emerge very quickly:

more branching, something like a wreath

And with a little practice, the patterns can become increasingly plant-like:

closer to a plant

An oddly symmetrical tree

So that’s it for branches. In the next post I will show how you can use branching to change the drawing angles, colors, line length and line thickness to create increasingly life-like plants.

More posts on this subject:

Lines
Angles
Rule sets
The Start Condition

Posted in ProgrammingTagged Flash, Lindenmayer, procedural art comment on Lindenmayer System Basics: Branches

L-System Basics: The Start Condition

2011-02-10 John Winkelman

In this post I will discuss some of the different patterns created by modifying the start condition in the Lindenmayer System Explorer. Clicking on any of the images will take you to the explorer tool, preloaded with the variables necessary to re-create that image.

So by now you all have seen the basic pattern which is created by the default settings in the explorer:

All well and good, but it feels incomplete; maybe a little lop-sided. Change the start condition to “F+F+F+F”, and you will see this:

How did this happen?!? Look at the angle: 90°. When you click the render button, the start condition and the grammar are run through an algorithm which creates a long string of characters. Every time an “F” is encountered, a line segment is created. Every time a “+” or “-” is encountered, the angle at which the next segment will be drawn is updated by the value in the “angle” field. “+” turns clockwise, “-” turns widdershins. So in this instance, every “+” means the next line will be drawn at a 90° angle to the previous segment. In the first example, having “F” as the starting condition drew, overall, a single quarter of a square pattern. Changing the start condition to “F+F+F+F” means that the initial 90° angle would be repeated 4 times, each at a 90° offset from the previous. 90 x 4 = 360°, which brings the line back to the start position.

This will work with any number which divides evenly into 360. Here is a 5-sided (72°) figure:

Six sides at 60°:

…and so on. As long as the starting condition and angles are correct, you can put almost anything in the grammar and use any number of iterations, and the result will still be a closed shape. Here are a few more:

Posted in ProgrammingTagged Flash, Lindenmayer, procedural art comment on L-System Basics: The Start Condition

Lindenmayer Systems: The Rules

2011-02-07 John Winkelman

In the Lindenmayer System Explorer tutorials I am posting I continually refer to “rule sets”, which are the DNA (so to speak) of the shapes which are created when the you click the “RENDER” button.

Rule sets are built as follows:
1. look at the current rule set, which in this instance is equal to the start condition “F”.
2. Look at the grammar, which in this instance is “F:F+F-F-F+F”.
3. Match the grammar character to the left of the colon to the characters in the start condition. Each time you encounter an “F” in the start condition, replace it with everything to the right of the colon in the grammar.
4. If we have not yet done this as many times as the iterator calls for, go back to (1) and repeat it with the updated rule set.

So with the default start condition and grammar, and the iterations set to “1”, the resulting rule set looks like this:

F+F-F-F+F

The Explorer simply replaced all of the “F” characters in the start condition with the entire grammar. Simple enough.

Now change the iterations to “2”, and click “RENDER“. The rule set now looks like this:

F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F

Instead of 9 characters, the rule set is now 49 characters long, and the resulting shape is more complex.

Changing the iterations to 3 will give you this 249-character long rule set:

F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+
F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-
F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-
F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+
F+F-F-F+F

…and here is 4 iterations, for a total of 1249 characters:

F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F+F+F-F-F+F+F+F-F-F+F-F+F-F-F+F-F+F-F-F+F+F+F-F-F+F

In each of these, the drawing tool starts at the first character and goes through until it reaches the end, following each instruction in order. So the first few characters in the above string would be read as:

“Draw a line. Turn right. Draw a line. Turn left. Draw a line. Turn left. Draw a line. Turn right. Draw a line. Turn right. Draw a line. Turn right.”

This can continue indefinitely. Complex starting conditions, combined with complex grammars and large numbers of iterations, can easily result in rule sets hundreds of millions of characters long.

Posted in ProgrammingTagged Flash, Lindenmayer, procedural art comment on Lindenmayer Systems: The Rules

Posts navigation

Older posts
Newer posts

Personal website of
John Winkelman

John Winkelman in closeup

Archives

Categories

Posts By Month

September 2025
S M T W T F S
 123456
78910111213
14151617181920
21222324252627
282930  
« Aug    

Links of Note

Reading, Writing
Tor.com
Locus Online
The Believer
File 770
IWSG

Watching, Listening
Writing Excuses Podcast
Our Opinions Are Correct
The Naropa Poetics Audio Archive

News, Politics, Economics
Naked Capitalism
Crooked Timber

Meta

  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org

© 2025 Ecce Signum

Proudly powered by WordPress | Theme: x-blog by wpthemespace.com