interactive development & discussion
After Andy’s ‘Mea Culpa‘ why wouldn’t it be…
But this is so much better and bigger, learning many lessons from the last launch – StomperNet strikes again!
Teamed up with Paul Lemberg a new product called FormulaFIVE (F5 for short).
Just launched a video to excite the industry!
So check out stomperf5.com now!
I’ve re-purposed an old project of mine, the interactive pog portfolio viewer, to activeden. I call it the pog portfolio because each work is represented by a circle, or pog, and you play ith it in the “bay” with different interactive physics configurations. When you click a pog you can view a close up image of that item and more details. The whole file has been cleaned up (code and graphics) and documented for easy customizations.It is a small file size as well, under 36kb swf!
This is mainly an image viewer, stay tuned for any updates, like video support etc.
Works and configuration loaded in through a single xml file. Select works from the bay to view title, description image and a link (if applicable). Organize works with the tags or select all and choose the physics of the bay for interactivity control (gravity, spring, grid and friction).
It is fully customizable and fully driven by xml. The xml file contains values for configuring the swf, and also all the information about each work to be included in the portfolio.
Each work is loaded into the ‘bay’ as a round thumbnail or ‘pog’. These pogs are animated with the interaction options (gravity, friction, spring and grid). The pogs are sortable by tags (parsed in from the xml).
The whole color scheme of the image viewer is configurable, or can even be set to random! Have a different color scheme every time your image viewer loads!
Clicking a pog in the interactive bay sends that thumb to the holding area and loads the close up into the focus window for that work. It also loads the details about that work into the detail box (to the right of the focus box). Each works needs a 50×50 thumbnail and a close up (max 375px x 270px) image. Focus images are all loaded in with an informative preloader and fade is once loaded.
Site easily integrates with Google Analytics to track user interactions within this flash portfolio!
All works in the portfolio are passed in through an external xml file, here is a sample work node from xml:
[cc lang=”xml” tab_size=”2″ lines=”40″]
Random Gear
Random gear photograph from activeden assets.
random_gear.jpg
random_gear.jpg
http://activeden.net
Photo|Industrial
[/cc]
Enjoy, and let me know what you think!
Website designed and implemented for American Program Bureau. Integartes flash content and video with html, all styled with css. Mock-up designed and approved with photoshop; built and implemented with dreamweaver (html/css) and flash. Visit the live site at American Program Bureau.
StomperLabs is proud to announce another cool, FREE software tool. The StomperTools Firefox plug in! We’re going to pack many tools into this plugin in the future, but to start it off we’ve bundled two functions into this plug in.
The first is called StomperNet Ranker, and it allows your prospects to quickly survey the rankings for a keyword query. We built an interactive graphical representation of a search showing results from three top search engines: Google, Yahoo and MSN.
I’ll give an example… Here’s the page as it loads a search for ‘circlecube’. The green nodes represent Google results, red is Yahoo, and blue is MSN. Each result that is for an identical page is connected with a thin line, and when you hover over a node it will grow and also any nodes for identical pages. Nodes for same domain pages will grow slightly as well to give an idea of the saturation on the search results by the specific domain. Below you can see that I’m hovering over the top-left node (the screen shot helpfully removed my cursor), the title of the page is shown and you can see that the same page (my home page) ir ranked number 1 in Google and MSN (hence the line connecting them, and also they have both grown to be large nodes). Also notice that pages of the same domain (circlecube.com) are at the top 2 slots in Google, the top 3 in Yahoo, and the top 2 in MSN (the medium sized nodes). Hovering over a node displays information to the right of the node chart. Clicking on a node loads that url below the ranker ui. You can also click the Google, Yahoo, and MSN buttons above the chart to see the actual search results at each engine specifically.
Ranker had the potential to become a great comparative tool for search engine optimization and comparison.
Not only does StomperTools give you access to Ranker right in your browser, but also you can instantly “Scrutinize” any page you’re viewing right from the browser (once you have the Stomper Scrutinizer tool, so go get it too!) Use the plug in to seamlessly aim your Scrutinizer browser to whatever page you’re browsing in Firefox.
Serious internet businesses require serious internet tools.
Firefox 3 is a dramatic step forward! Help Mozilla.org set a Guiness Book record by downloading the new release on Tuesday the 17th of June 2008 (11 AM PST).
To celebrate, StomperNet and Appcelerator are hosting a release party in Atlanta at Park Tavern as a part of a world-wide network of celebration Tuesday, June 17th at 7pm. RSVP at upcoming.org.
Join us if you’re in town, otherwise, check the downloads for Firefox 3:
StomperTools with SN Ranker and Scrutinize this, and the recent Scrutinizer 1.0 release.
Park Tavern
www.parktavern.com
500 10th St Ne
Atlanta, GA 30309
(404) 249-0001
Tuesday, June 17th 2008
7pm-9pm
Get the Stomper Scrutinizer browser vision simulator. Plus get StomperTools … featuring Scrutinize This and the SN Ranker SEO tool.
The Scrutinizer is a web browser, based upon the Adobe AIR toolkit and the WebKit browser, that offers a simulation of the human visual system. Specifically, it illustrates the distinction between foveal and peripheral vision in visual acuity and color perception. Using this simulation, you can get a better idea of how users interact with your site design. We explain this, and some of the succes we’ve had, in a 30 minute video called Click Fu. It’s also a great tool for observing users interacting with your pages. By slowing them down, the Scrutinizer makes it easier for you to figure out what information the user is consuming and what actions they are considering. Learn about other ways to use the tool at our Top Ten list.
The Scrutinizer browser applies a visual filter to where the mouse is located, simulating foveal vision centered around the mouse. For parts of the screen far away from themouse, the display deteriorates into lower resolution, both in detail and color. You can use the browser to get a better understanding of the low level mechanics of how users interact with your site design. Attempting to accomplish a key task on your site using the Scrutinizer can be very enlightening. Watching a user unfamiliar with your site attempt a key task with the Scrutinizer is even better at revealing how your site design affects the way the user extracts meaning from your presentation. Learn more in the Click Fu video, covering practical examples of improved e-commerce, or the 52 second ” Your Vision is an Illusion“, presenting a dramatic illustration of foveal vision. Finally, check out using the Scrutinizer for a findability challenge on Amazon.com.
Site built for Going Natural 3, free series of videos to promote the re-opening of StomperNet. Includes flash video and html template design in drupal all styled with custom made themes and css. Users were prompted to subscribe with email address and then allowed to view the premium video content and comment. Site discontinued, but video content still available at stomperblog.
Here’s a new site and series from StomperNet called Going Natural 3!
It’s a bit of free videos made and released to showcase the talents and business of what StomperNet is about and what they do for their clients. They’re ‘moving the freeline’ so to speak…
The first video series begins with Dan Thies talking about his ‘Crazy Theory’ for AdWords.
On signing in there are a couple BONUS videos for you as well. So go check them out as well!
Watch Going Natural 3 – Adwords Triangulation Method and more
[kml_flashembed movie=”http://beta.stompernet.net/goingnatural3/files/gn3Players.swf” height=”338″ width=”450″ fvars=” playlistURL = http://beta.stompernet.net/goingnatural3/files/playlist/vid1_adwords_triangulation_method.dhtml.xml ; autoplay = false ; awiz = 1126 ; embed = 1″ allowfullscreen=”true” fversion=”9″ useexpressinstall=”true” allowscriptaccess=”always” /]
This site contains the latest flash video player built by yours truly. I also did the design of the site: involving html, css, php, javascript and dealing with drupal too!
The flash video player designed and developed for Free IQ and StomperNet. Plays video and audio content for a user. I implemented 85% of the actionscript, creating intuitive interactivity and functionality. External xml plsylist, author biography display, content details, share by email, social bookmarking, get embed codes, and more. Sleek design for maximum intuitive user engagement including navigable playlist, author biography, video detail, embedding, email, social bookmarking, volume control, full screen, multiple size options, etc.
As announced, the Free IQ Media Player now incorporates Google Analytics with it’s custom flash video player. Simply put, users may upload their own content (or even use anyone else’s content that is on Free IQ), embed it on their own sites and then view the tracking/logging/usage/analytics/metrics it their own Google analytics account. You don’t have to do anything- the player will do it automatically, but if you don’t have google analytics installed on your site, nothing happens. So go ahead and sign up, it’s free and very useful.
This works with both versions of Google analytics tracking code. Recently Google updated the code they give users to enhance the functionality of the analytics they give you in their reports. Some have voiced concern about whether they can update to the new code and still use the Free IQ video tracking, now the answer is yes! This new updated player works with the new Google Analytics Tracking Code! Others have voiced a concern that they aren’t ready to update the Google code on the rest of their site yet, this is not a problem either. The Free IQ Player works with either version of the GATC (Google Analytics Tracking Code). It would even work with both… say you had a site with some old code and some new code, the player knows and will tell Google what people are doing with this player on your site.
To see the report, go to your google analytics account, click on ‘Content’, and then ‘Top Content’. This page shows you the most viewed pages on your site. You can filter the report by typing in the box under the list of urls. Find the ‘Find Url’ box (be sure ‘containing’ is selected in the drop-down) and type ‘freeiqvideo/’. Press ‘go’ and you should see all the analytics for the Free IQ player on your site! All the analytics from the player start with ‘freeiqvideo/’ in the url path and we’ve organized all the analytics into three different types: Video, Actions and Navigation. Every time someone does any of these things on your site, google analytics will log a pageview to a certain page. This certain page changes and depends upon what the user did exactly. When a user visits your site and begins to watch a certain video called ‘My Cool Video’, google analytics logs a pageview to ‘freeiqvideo/playstart/mycoolvideo! Notice that the title of the video is incorporated into the report, this helps determine which video is more popular and such. The title of the video is the title you give Free IQ upon uploading your content and can usually also be found at http://freeiq.com/mycoolvideo
This information can be very helful as you think about which video to place or keep on your site, and even where to put it. You can also see how many times the video was finished (freeiqvideo/playcomplete/mycoolvideo). This can be very useful to help you determine if your video is too long, too boring, or on the other end very engaging- it’s essentially your video bounce rate.
Other than video tracking, the Free IQ Player also logs to google analytics actions users have with the player itself. The Free IQ Player enables users to share your content with others. There are interactions with the player for users to email a link to their friends about the content they are watching, get html codes to embed that content onto their own site, and even share the content with any of a number of social bookmarking sites! If someone were to use the Free IQ Player to link to your content through a popular del.icio.us the report would log a pageview at ‘freeiqvideo/PlayerInteraction/SharedVideo/delicious/mycoolvideo’! You will see which bookmarking service was used and what content was bookmarked! You will know what users are doing with your content!
And lastly you can see how users navigate through the embedded Free IQ Player. Inside the player, users are presented with information about the content they watch. All this information is organized into tabbed windows. Every time a user view’s this information, the player logs to google analytics a page view. These logs are independent of the content, so the url reported does not include the video Title as before. An example is a user views the author window is: /freeiqvideo/PlayerNav/WindowSelected/author.
Here is the breakdown of all the logging from the Free IQ Player to Google Analytics:
Video Tracking:
Play Started: /freeiqvideo/playstart/mycoolvideo
Play Completed: /freeiqvideo/playcomplete/mycoolvideo
Interactions:
Embed Codes Copied: /freeiqvideo/PlayerInteraction/EmbedCodesCopied/mycoolvideo
Email Sent: /freeiqvideo/PlayerInteraction/EmailSent/mycoolvideo
Bookmark: /freeiqvideo/PlayerInteraction/SharedVideo/bookmarkingService/mycoolvideo
Navigation:
Author Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/author
Playlist Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/playlist
IQPON Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/iqpon
Share Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/share
Email Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/email
Embed Tab Selected: /freeiqvideo/PlayerNav/WindowSelected/embed
This is the list of current integration with Google Analytics from the Free IQ Player. If you have any questions or requests, feel free to comment here or contact Free IQ.
How to convert DVD to iPod mp4 Video? PQ DVD to iPod Video Converter Tutorial.