Tag Archives: process

Interactive Physics Animations Javascript Canvas 06

canvas06

Here we’re going to get more into the interactive programming on these dots. We started with one dot that was draggable. This update applies a drag/drop code to each dot object with some logic to keep track of which dot is being dragged. This is quite a bit different than accomplishing the same thing in [...]

Posted in interactive javascript canvas, tutorial | Also tagged , , , , , , , , , , , , , , , , , , , , | Leave a comment

Interactive Physics Animations Javascript Canvas 05

canvas05

Now we’ll apply this object oriented programming to each dot and give them all random placement. interactive physics animations via javascript & canvas | 05. $(function () {     var canvas, context, width, height, x, y, radius = 25, clickX, clickY, drag = false;             canvas = $("#canvas")[0];   [...]

Posted in interactive javascript canvas, tutorial | Also tagged , , , , , , , , , , , , , , , , , , | Leave a comment

Interactive Physics Animations Javascript Canvas 04

canvas04

This time we won’t make the canvas any different visually, it’s more just cleaning up the code. We’re making the circle into a dot object, then later it will be easier to keep track of it (and any others). interactive physics animations via javascript & canvas | 04. $(function () {     var canvas, [...]

Posted in interactive javascript canvas, tutorial | Also tagged , , , , , , , , , , , , , , , , , , | Leave a comment

Interactive Generative Art Series – 08 – multiple lines scalable

gen-art-8-01

Well, so much for blogging each step in my process of creating this generative art series. I took a few steps in this iteration since the last one. But it was all in the spirit of one step. First I wanted to abstract the duplication of each ball/line so that it didn’t require copying blocks [...]

Posted in generative art | Also tagged , , , , , , , , , , , , , , , , , | Leave a comment

Interactive Generative Art Series – 07 – multiple lines

gen-art-multi-lines 01

To make it more interesting and give more depth and texture to the display, I wanted to have more lines than one, so I’m now going with two for starters. Eventually I’d like to get up to a dozen or maybe even have them randomly self populate and die over time. Adding one more isn’t [...]

Posted in generative art | Also tagged , , , , , , , , , , , , , , , , , , , | 1 Comment

Interactive Generative Art Series – 05 – wild anchor

gen-art-05-wild-anchor-4

While in the previous step (Generative Art 04 Using a target other than the mouse) in this generative actionscript art tutorial series it was cool to see everything move on it’s very own, it seemed a bit slow or fake, or maybe just plain uninteresting. Tinkering with the color, I thought if we set a [...]

Posted in generative art, tutorial | Also tagged , , , , , , , , , , , , , , , , , | 1 Comment

Interactive Generative Art Series – 04 – anchor

gen-art-4-anchor-6

Thanks for keeping up with this random generative art series. I know I’m having a ball just playing with code one step at a time. To watch each iteration, I was getting tired of drawing with my mouse to see the generative art, and as others had pointed out, in order for it to truly [...]

Posted in generative art, tutorial | Also tagged , , , , , , , , , , , , , , , , , | Leave a comment

Interactive Generative Art Series – 02 – Random Color

gen-art-02-1

With this example we’re taking a look at having randomly changing color. I liked the limits to the color in the last post, but couldn’t help myself and wanted to see it with the full range of colors to command. Also, I wasn’t a huge fan when the color would “wrap” and jump from one [...]

Posted in generative art, tutorial | Also tagged , , , , , , , , , , , , , , , , | Leave a comment

Get file path easier on a mac with applescript | Copy Path script droplet

Picture-2

An issue I’ve had with managing multiple files and versions of files and different servers and emailing files around to different people throughout a process… you get the idea. I looked for a way to get the path to a file like a url online. that would be easy for anyone to navigate to, while [...]

Posted in other, review, tutorial | Also tagged , , | Leave a comment

Web Design and Carpenters

good cheap fast

Does your website pass the big bad wolf test? I’ve been building websites for years and always enjoy the immediacy of designing and coding a site and having it live relatively quickly. Compare web production to the construction industry where projects span out years and even decades in some cases. Even though the web does [...]

Posted in Article | Also tagged , , , , , | Leave a comment
  • Recent Posts

    Touch Specific Media Queries in CSS4

    Proposals in the works for new media queries specific to touch enabled devices. Examples include pointer, which will differentiate wether the device has a fine or coarse pointer (finger vs mouse) and hover, which would say if the device supports hover states. I can see this being helpful and useful for building mobile friendly sites [...]

    Responsive Image Dispute and Tourists – Analogy

    Jason explains the root of the problem and why no one has been able to devise a solution that makes everyone happy yet. The browsers (in their awesome drive to make browsing faster) are prefetching images and developers want to only use one image based on criteria the browser doesn't know until the layout is [...]

    Google Moog Keyboard Synthesizer Detailed

    This post on creativejs picks apart how this doodlue was made. Nice they they are able to support HTML5 audio even if it is only supported on chrome and the rest fall back to – you guessed it – flash. Embedded Link Google Moog synth tear-down Yesterday we featured Google's web-based analogue synth Moog tribute [...]

    Synth Emulator on Google Japan Doodle Today

    Synth Emulator on Google Japan Doodle Today Embedded Link Moog 自分のオリジナル曲を創って、 #moogdoodle で共有しよう。

    WordPress updates plugin directory

    New additions to the plugin directory include: favorites, incorporating support forums into it's own tab for each plugin as well as support stats being displayed! Great! I think we also need the ability to give plugins ratings and reviews (bonus points if it can be done from within a wordpress admin dashboard when installing plugins). [...]

    Short Head

    Use zipf's short head to tune your website rather than redesign the whole thing. To make a website successful it needs to meet the needs of the users. Find out what those needs are by using the short head philosophy to equate most searched things as the biggest needs of the users. Use personas to [...]

    Img Set?

    Great article at a list apart discusing the state of the industry regarding responsive images. This picks apart the set attribute of the img element from a surprisingly objective view coming from someone so close to the picture element. Insightful discussion about the principle behind the proposals than the actual solution too. If the working [...]

    Triudo

    A mesmerizing animated triangle-ish shape form. Embedded Link triduo triduo

    Git – the paradigm shift

    A great developer story about the differences on what Git is vs other version control and what Git is not. This is how we should learn it. I heard over and over that it was distributed, but never grasped what that meant, so here are a few links and explanations that will help unlearn version [...]

    Tweening Lib comes to Javascript!

    I'm very excited to share the news that the tween library from GreenSock (hands down the best tweening library I used in flash) is not ported for use in javascript! This will be great! I missed that simple syntax from as3 when animating javascript, and now I can have my cake and eat it too. [...]

  • Recent Comments

    Bruce Brownlee

    Bruce Brownlee

    Ah IE6. I'd have 2 more years of sleep without IE6. Margin doubling, no properties,...
    versaena

    versaena

    how to give color at runtime…… thank you
    Mobile Websites

    Mobile Websites

    I disagree, mobile websites are the future – desktop websites and mobile websites...
    Matt Fasick

    Matt Fasick

    That's cool. I like the ripple effect as well.
    Nico

    Nico

    hi! really great job guy! very impressive.. just a question… do u have a solution to do a refresh...
    Evan Mullins

    Evan Mullins

    Agreed! I've just seen some people get pretty heated about separating all functionality...