You're invited to play: Guitar Designer Tool

[Jumble Jumble]

It would be great to have that, because you could create something amazing and show it to Tonar or someone of see if it can be done.

In addition to hat though, it'd be nice to have "presets" for the Warmoth colors.

 

[Suzanne]

Hey nice blog Jumble.

FYI I updated that blending demo to include some different wood grains... You can now choose something like Quilted Maple and then apply a color with a blend mode. Not many colors, but enough to get the idea of how many different results can be generated even from just one color.

Anyway, yeah... presets... ugh.

 

[Jumble Jumble]

Thanks!

It's gone silent at the moment because I'm not doing any work. Once I get paychecks rolling in again I expect it'll start getting updated.

As for presets. You know it makes sense. Someone's going to want to be able to just pick "Fiesta Red" or "Mary Kay White" straight off, without knowing about blend modes or opacity.

 

[Suzanne]

Yep I know. I believe that's important to be able to simulate exactly what you can get from Warmoth or another painter.

 

[Suzanne]

Well I am very very happy to report that I have successfully figured out how to recreate the guitar configuration tool using HTML 5 and Canvas. Not only is the code 100x lighter, I no longer need to create all these images for a new body and this also solves the issue of how to implement the 24 fret option AND the addition of bass guitars.

With Canvas, I can simply give you the option for a longer neck. You can use the same body shapes for guitars or bass guitars. Just drag the body lower down the canvas to accommodate the longer neck. Want the 24 fret option? No problem, just drag the pickups a bit lower down the guitar body to clear the fretboard.

Everything will be draggable and I'll constrain some things like the fretboard and body, to just vertical movement, helping you keep everything lined up with center. Things like knobs obviously get free movement.

The only thing I don't fully like is the fact that there aren't any truly solid methods yet to blend two layers like you can in Photoshop. There are a couple of libraries that attempt to do it, but the results are not as good as what you see in my images on the current site. More on that as things evolve.

Very promising.

And one funny side note... when I get stuck with the code, I take a nap and just intend to solve the problem in my sleep. Yesterday I did just that and in a dream I said to myself, "You have to instantiate the shape layer!" I woke up thinking, "Yes! Yes! That's it!" and then I realized I had no idea what that meant. Funny the way your brain works.

 

[Suzanne]

Just an update on the conversion to HTML 5 and Canvas. You can now take sneak peek at it here:

http://guitarsparks.com/machine/

Browsers: Opera, Safari, Chrome and to some extent Firefox. Firefox still does not have support for many HTML 5 features and if you research why, you'll find they're still arguing in their development forums about who's got time to even look into it. Me thinks they've all secretly switched to Chrome and don't want to admit it.

Implemented so far:

• All major body shapes and even some minor ones (bass to be added soon)
• All major headstock shapes
• Good number of body and neck (headstock) woods so far (not all in the dropdown have images yet)
• Move the wood grain around by clicking the Randomize Texture link or use the sliders to fine tune
• Color picker for body and headstock paint
• opacity settings for both
• ability to have headstock "match body finish"
• scale the body if you want it bigger or smaller
• body binding (black, cream, white)
• same fretboards as before
• draggable elements

For the geeks: The canvas functionality provides a lot of efficiency over the original method I was using. Sheesh! We can now scale the body shape to be bigger or smaller and the pickguard can scale right along with it. I've attempted to get the body shapes true to scale, but that is very difficult to do accurately. Some may need to be tweaked. Scaling affects the position of the layers, so some repositioning is necessary at the moment if you scale the body.

Another huge perk is going to be the ability to scale the fretboard, so if you want the Gibson scale, or the Fender scale or the 24 fret conversion or a bass neck, you can just select it and move your pickups around to accommodate that. I don't have that implemented yet but I may do that next. Either that or I may tackle the color blending code.

No hardware yet. I'm holding off on that until I figure out how to best implement the shapes and paint jobs. Lots of tricky stuff do do there yet.

Lastly... I am actively working on that form so I break it every two minutes. Expect bugs.

 

[Jumble Jumble]

Very good. Works great on iPad too.

 

[Suzanne]

Indeed! This new javascript library I'm using included that and the tracking is really good. Kinda slow on the original iPad 1 tho... can't help that.

 

[alterbridgefan]

Problem: gloss is wierd.

 

[Suzanne]

You might have missed the BRIGHT RED TEXT that reads: Currently working on the gloss  :laughing7:

And now the gloss is done and it scales *with* the body shapes below it now too.

 

[Jumble Jumble]

This is going to KILL Kisekae.

 

[alterbridgefan]

You might have missed the BRIGHT RED TEXT that reads: Currently working on the gloss  :laughing7:

And now the gloss is done and it scales *with* the body shapes below it now too.

So I did. :toothy11:

 

[trilby]

Wow, Suzanne, just... wow.  It's awesome to see how well the HTML5 approach is working, though I'm sorry to hear that Firefox's support is a little lackluster.  Hopefully that'll improve.

 

[Suzanne]

True! I'm glad it's panning out too. I got a bit more done yesterday but I'm unhappy to report that I have strained my back which has caused part of my left arm and hand to go numb. Very painful. Very irritating. Cannot barely sit at the computer at all, let alone play my guitar! So not much progress last week or probably this week.

I did however, get this done yesterday:

• New grouping feature allows you to move (for example) all the body layers (wood, paint job, gloss layer, pickguard) all together. If they weren't grouped, you'd have to move every single layer individually which would be a major pain, so grouping is now in effect.

• Tuners were added

• Fixed scaling of the body so that the body now scales from top center point, not upper left point, lessening the need to reposition the body after scaling. All body layers scale together as well (because we scale the group - so cool, especially once the pickguard and any overlay paint is applied)

• Pickups are in process. I started these but could not complete them yesterday. They work if you're clever with the submit button. Pick your pickups with the drop downs, but hit the submit button to get things applied on the canvas. The javascript for pickups is very complex and I have not gotten to that piece yet but submitting the form with the submit button will get you 90% of what you want. No pickup rings yet tho.

• The SAVE IMAGE button now works, creating a PNG image of your custom creation, BUT, it will crash Safari. No problems in Chrome or Firefox there.

• BUG: I notice I created a bug with the headstock somewhere along the way, switch the headstock and nothing happens. Switch it again and then it will switch for you. Will fix that as soon as I can.

That's the report for now. Hope to have more this week if I can Rock on!

 

[Suzanne]

Clarification... it appears that headstock switching bug only exists for iPad/tablets... I don't see it happening in a normal browser.

 

[alterbridgefan]

progress?

 

[reluctant-builder]

progress?

Is my middle name.