I have been working on a tool to visualize your Amazon Web Services usage logs for EC2, RDS, SQS, S3, SDB (and soon CF). There will be a limited free version and a full version that has the dashboard and the drill down for each of the services. This tool is still in development but my todo list is getting shorter...so you can have a sneak peek here:
What a conference! The talks where really awesome so far. Not exactly sure what I will attend today. I might attend “Optimize it! ActionScript Tips for iPhone Games” followed by “Adobe is from Mars, Microsoft is from Uranus: A View from the Client”. Then I will have to split early to catch a flight to Salt Lake City for the MountainWest RubyConf 2010.
Optimize it! ActionScript Tips for iPhone Games Renaun Erickson
Renaun is Plaform Evangelist for Adobe since last week. He will put up the slides and code on his blog later today. Many of the tips are good for any Flash/Flex app not just for iPhone ones.
Packager for iPhone (PFI)
LLVM cross compiles
He will focus the talk on Memory/Cpu/Mouse Move and Game Timers.
Instead of going to the Flex/Silverlight talk, sorry Jun and Eric, I went to Nate Beck’s talk on pushbutton. And Doug McCune had something special planned for Nate’s birthday…
As you saw yesterday afternoon I didn’t blog too much, so let’s how today goes. The party last night was really fun, lot’s of networking, rock band playing and just a nice general geek atmosphere.
Evolution of RIA Design Principals
Right now the “Evolution of RIA Design Principals” panel is about to start.
Panel is:
Chet Haase – Senior Computer Scientists at Adobe
Bill Scott – Director UI Engineering at Netflix
Ehud Waizer – SAP
Paul Guirata – Catalyst Resources
Context: oriented to customer facing applications. Not games.
Chet Haase
He works on effects at Adobe. Effects used in a subtle way can make the user more effective.
What are the top 3 rules
Transitioning
Anticipatory
well-timed.
Don’t Lose the User.
Bill Scott
Principles for Interesting Moments
Input where you output
Require a light footprint
Stay in the flow
Offer invitations
Be reactive
Use transitions
Paul Giurata
Modular
Reusable
Panel vs Page
Panels being reusable application(s)
Panels being re-used down to the code level
Panels potentially being entirely separate applications
Kevin’s presentation was how to drive a phidgets board to control dispensing beer to users with an rfid, taking a picture along the way and counting the numbers of beers that user had so far. The board is driven from a Flex application. It was really impressive presentation.
Actually today is the first day of the conference. Yesterday was a tutorial day which was really fun. Today there will be a bunch of 1h20m sessions throughout the day. The conference is at the ebay headquarters.
I was with three other guys from Denver and we nearly missed the start of the keynote as we took the light rail in the wrong direction. How can 4 engineers go so wrong? :-) Anyhow it doesn’t seem we missed to much as it’s starting with a talk from the sponsor (ebay/paypal) about the eBay developer program.
Keynote
Now onto the main keynote by Deepa Subramaniam on the Adobe Flash Platform for her first keynote given ever. She is the new Product Manager of the Flex SDK.
The Flex 4 release is coming really soon.
Overview of Flex 4
Demo of spark components
Data-Centric Development
Video from the Flex team (geek funny)
It’s great that Deepa become the project manager of Flex 4, she understand what’s programming is about. She now continues her talk on the Open Screen project.
How it all works: components need to size themselves, need to be created at runtime, need to interact with parents and children
Instanciation: all Flex components start with a constructors. Constructors in Flex add event listeners and setup initial properties…That’s it.
Display List: list of all the components that are on the screen at one point or another
Creating children: all visual children of a component are created in the createChildren method. The visual children of a component exists in the skin and so the skin is first created at this time.
Sizing: each component implements the measure() method. Flex works on the principle that children must be sized before their parent and it makes the sizing process potentially asynchronous. It works via a priority queue. Priority based on nest level.
Flex 4: children leave inside a skin and not the parent. The skin is a component, so we ask it the size of it’s children.
Measured Data: measure is only a suggestion.
Sizing: parents size children. A component does not size itself.
Sizing and Positioning: sizing and positioning is done in a method called updateDisplayList().
UDL: components are given a size. One the size is given, the component is free to do what is wishes. For the most part, this information is simply passed down to the skin. Again recursion.
This was a great talk and clarifies many things which is great timing as I’m starting to dive deeper into Flex 4.
We just had a great breakfast at Peggy Sue’s Dinner…and moved over to the Ebay Headquarters where the conferences is about to start.
I’ll be taking notes during the day and updating this page as we go one.
UPDATE: Now that I typed all that I realized that Justin put up the slides and code on his blog: http://blog.classsoftware.com/.
Connecting Arduino Hardware to Flex: Justin Mclean
twitter: justinmclean
Justin is from Sydney, Australia.
Content:
Arduino platform, how to program and how to connect to Flex
2/3 Arduino 1/3 Flex
Hands on
So we’ll go through the followings:
Digital Inputs
Digital Outputs
Analogue Inputs
Pulse Width Modulation
Serial Communication
Connecting to Flex
Review and wrap up
So Justin gave each attendee one board and a set of components. The board is open source hardware. I think that’s pretty cool. Feels like the hardware kit I bought for my 6 years son. The board is $25 and with all the components it’s about $40.
The hardware is provided to all participants by sparkfun.com
Software
http://arduino.cc/en/Main/Software
Also install the serial driver: FTDIUSBSerialDriver_10_4_10_5_10_6
Other Hardwares
ATmega micro-controller from Atmel. It mostly runs in cars.
Arduino Duemilanove
Arduino Pro and Pro mini
Lyllypad (warable)
Funnell IO
Mega
Many others
ATMega328
Hight performance low power RISC
16 Mzh up to 16 mips (faster as your first pc you owned – if you are a bit older)
Many open source sketches (projects) and libraries availables. Ethernet library, servers, …
First Program
int ledPin = 13; // LED connected to digital pin 13// The setup() method runs once, when the sketch startsvoid setup() {
// initialize the digital pin as an output:
pinMode(ledPin, OUTPUT);
}
// the loop() method runs over and over again,// as long as the Arduino has powervoid loop()
{
digitalWrite(ledPin, HIGH); // set the LED on
delay(1000); // wait for a second
digitalWrite(ledPin, LOW); // set the LED off
delay(1000); // wait for a second
}
Now this will make the led blink:
Programming
C like language based o wiring
Write code and compile in IDE
Upload compiled code using USB
Hard to debug
Circuit Basics
Ground and power
Potential difference required for current ot flow
Conductors and resistors
Digital Inputs/Outputs
Digital pins on Arduino are dual purpose
Digital logic and voltage on = 5V off = 0V
Can be set to be input or output via pinMode
Variables
boolean, char, byte, int, long, float, double, string and array
int 16 bits, long 32 bits, float 32 bits
Strings are nul terminated ‘\0’
Declare by ; eg int i;
It’s actually C++…What?! At a Flex conferences :-)
Setup Function
Used for initialization
Run when program loaded or board reset
Best place to place calls to pinMode
LEDs
Current will only flow in one direction
Longest pin connect to positive side, shortest to ground
Dont’ connect directly to power source use in series with resistors
Resistors
Resistors limit current flowing through them
Value and tolerance indicated by cooler bands
Resistor values for LEDs
For RGB or LEG digits you need multiple resitors
REG/GREEN/BLUE 180 oms, WHITE/ULTRAVIOLET 100 oms
Debugging ia Serial Port
Use Serial.begin to set speed
Serial.print, Serial.println to output
Use serial monitor in IDE to view
Blinking LED
Same program that the first program but this time we just set the led to the pin 3 which is connected to the board.
Digital Inputs
Some logic as inputs; hight 95V0 or low (0V)
Simplest digital input switch
Call pinMode to set as digital input as input
Connect Switch
Wire up push button on breadboard
Change code to turn light on/off
Now switches have three states (on, off, and in between) to the board needs to be wired to take that into account so you can program it accordingly. We added a very high resistence (10k) next to switch to ensure that the switch reports 0V when not clicked.
int led = 3;
int button = 4;
void setup() {
Serial.begin(9600);
pinMode(led, OUTPUT);
pinMode(button, INPUT);
}
void loop() {
if (digitalRead(button) == HIGH) {
Serial.println("on");
digitalWrite(led, HIGH);
} else {
Serial.println("off");
digitalWrite(led, LOW);
}
}
So let’s look at the wiring and how the switch operates:
Internal Pullup Resistors
Set mode to input
digitalWrite to HIGHT to turn on
digitalWrite to LOW to turn off
So there is something like the 10K resistor built-in the board to avoid using an extra resistor on the board to make sure the switch values are on or off.
Switch Issues
Switches can bounce and give and off values while switching
Noise can give false results
More a problem when switching needs to be counted
Use timer to solve issue (time = millis())
Analog Inputs & Potentiometer
Can read values via analogRead
Result is in range 0 to 1023 (10 bits)
Potentiometer is Variable resistor
Eg Read potentiometer values with Analog Inputs
int led = 3;
int pot = 0;
void setup() {
Serial.begin(9600);
pinMode(led, OUTPUT);
}
void loop() {
int value = analogRead(pot);
digitalWrite(led, HIGH);
// Set delay based on analog input
delay(value);
digitalWrite(led, LOW);
delay(value);
}
So now when the potentiometer is turned to the right a value of 1023 is returned and the lights blinks on and off for about 1 seconds. Turning to the left makes the delay shorted (down to 0) and you can get it to run blink really fast.
LDR
Light dependent resistor (high resistance)
Set flash rate based on value of LDR
This is a great full day tutorial and everyone seems to have fun. It’s pretty basic, but it’s the first time I program hardware.
Now we are writing fadeIn and fadeOut functions and get the light to pulse on and off
Now we replace the light sensor by a temperature sensor. There are also air quality sensors, breathalyzers.
Flex
Communication between Flex and Arduinos.
Software on Arduino (Firmata)
USB serial to socket proxy
Flex event based library to talk to socket (as3Glue)
Firmata is an Arduino library that support a binary protocol over serial interface. It’s Bi-directiona. Use version 2.
In the Arduino IDE let’s load the StandardFirmata program (File|Examples|Firmata|StandardFirmata). It’s a 286 lines program similar to the code we wrote so far, but more complex.
Server Proxy
From http://arduino.cc/en/Main/Software the server proxy (end of page)
To configure proxy first find what your serial device is.
In terminal do: ls /dev/cu*
Thought Equity Motion and NCAA two days ago officially released the Ncaa Vault. A cool Flex app backed by an incredible video database with awesome metedata about each game…and released just in time for March Madness.
Here are a few of the announcements and online articles describing the services:
This is the most visible Flex app I worked on :-) Late January Cameron Pope contacted me to ask if I could help on a Flex project for NCAA and Thought Equity. The funny part is that I didn’t know that Cameron was such a great Flex developer, I met him via the Denver Ruby on Rails User Group (derailed) and I also didn’t know what NCAA was (don’t shoot, I didn’t grow up in the US and we don’t have TV). So when I asked my father in law about NCAA and realized it was about Basketball I was intrigued by what type of application we needed to build. Cameron showed me the mockups built by Donny Wells which is just an awesome graphical designer. These mockups where just incredible and then I was presented the video service technology the Thought Equity Motion team put together, and I was just blown away and though that this would be a cool project to work on.
Cameron was the main Flex developer and I just worked part time on Monday’s on this project. If you need and incredible Flex developer just contact Cameron.
Now let’s dive more into the Flex nitty-gritty details:
For the mvc architecture we used the Swiz Framework and this turned out to work exceptionally well. Swiz sports some dependency injection features that can be enabled via the [Autowire] tag and I was surprised when I realized I could also just use that feature in an item render. Let’s look at a little detail…For the play by play timeline if a play is in the future it is displayed in bold:
So each line of the timelime is rendered by the TimeLineItemRender and you can just autowire the model which contains the playhead position.
[Autowire]
[Bindable]
public var vaultModel:Vault;
The we can set the style name accordingly based on the play’s start time and the current playhead position:
The style of the application was created by the designer and Cameron did a great job reproducing it using Degrapha for skinning () using an approach similar to this example (example source)
Most of my work was around the searching, bug fixing and general architecture overview. We took a similar approach to the one I described here in order to avoid most of the server round trips during searching.
The Flex app is just a pretty face, behind the scene Thought Equity provides an incredible services that they will expose in many ways, the start can be seen here and all that data will be able to be accessed via API and other means.
This was a short but incredible project for me, the guys at Though Equity have such an incredible vision on how to turn these sport videos into something so much bigger! Thank you guys for getting me on board.
I met Phil several years ago at Derailed, the (Denver Ruby on Rails user group, and for a long time he was curious about how Flex can be integrated with Rails, about the graphical possibilities that Flex offers, the advantages over plain HTML/CSS/Javascript. Then he told me Kacie, his wife, had an idea about a website. She is passionate about quilts and has an eye for details and excellence. Phil is a geek that loves Rails, Kacie loves quilts, it's like Quilting meets Web 2.0 and quiltivate.com was born. In fact Phil and Kacie hired me to create a Quilt Builder that integrates with Quiltivate.com. Kacie had the vision for the whole concept, a simple to use quilt builder that removes lots of the hassle of calculating how much fabric of what color is needed and allows to play with blocks, shapes and colors. She drew a paper prototype that really highlights the tag line of their site" Innovating Traditional Quilting". Quiltivate.com offer much more than a Quilt Builder, it's a blog and a community centered around the art and craft of quilting. Over the last year I spent a couple of hours here and there, well a little more than that, to transform the paper prototype into a real Flex application. Rather than writing about what the tool does and how it does it, let's have a little look at behind the scene of the Quilt Builder with this video:
Check out quiltivate.com for a video on how to really use the Quilt Builder and go try it out. As it's fresh out of the gates their may be a little quirks here and there, so please let me know what you find. So thank you Kacie and Phil for getting me on this project, it was really fun!
Enjoy,
Daniel.
I was not really happy with last week's screencast I did on testing Flex with Cucumber. Effectively doing screencast is not an easy endeavor and trying to it myself is making me appreciate all the other screencast I watch so much more. So last week I just wasn't comfortable while I recorded it, not sure why, but I thought I should try to capture it again. And the second time around I felt better, maybe I should alway take two takes (or even more :-). So here is the new one...