ScaleNine

With the announcement of the Flex Builder 3 Beta 2 being now available, I though I’d share some of the styling tools that will make styling your application a bit easier.

Additional Style and Skin Options
Now, in the Flex Properties panel in CSS Design View, you can access a variety of options for Styling and Skinning. The Styling portion adds more visual indicators to things like alpha, fillColors and there are inputs for things like padding, icon specifications, rollOver text colors, selected text colors, etc. The Skinning portion allows for easy selection of a skin. Once selected the CSS embed code is dropped into your CSS file.

Scale Grid Guides
You can now set/edit the scale9 grids right inside of the CSS design view. Whenever you change the values, your CSS file is updated. No more having to guess on the values or using another application to get the exact pixel perfect values.

Auto-Embed of Fonts
I’ve heard of a number of issues people have had embedding fonts for use in an application. Either a font weight wasn’t available, a wrong guess for a fontFamily name was made, etc. Now, when you creating a style you can select a local font from a drop down and, once a font is selected, you can click an option to embed the font. The proper CSS code is written to your CSS file and you’re ready to go.

One thing I did notice is that if you select a font and then select a different font, the former font embed code stays in your CSS file. When changing fonts in Design View to find one you like, make sure when you do find one that you go back to CSS file and remove the unnecessary font embed code.

Auto-Embed of Icons
Just like fonts, you can select an icon to be used from two options: Flash symbols and image files. When you select either Flash or image files you can browse for a SWC, SWF or image file and select your icon. Then, like the fonts, the embed code is written for you.

Additional Styling Navigation
In the CSS Design View there are additional features to help navigate through your styling. Rather than using the Outline panel to navigate through your styles, there is now style selector combo box next to the Source/Design toggle buttons. This is great for quickly switching between styles.

Also, there now some buttons for adding a new style or deleting the currently selected style. There’s also a color picker for selecting the background color that your skins sit on while you’re editing a style.

These are some of the immediate features I noticed and they’re all great for productivity. I think these additions will definitely help people get through skinning/styling their applications with fewer headaches. Nice!

Everyone’s been blogging about the new Flex Developer Center and some of the new features. The area I’m most excited about is the new Flex Interface Guide area. There’s already some great information up and some more on the way. I’m digging the sample FIG components which include a Callout, Paged Lists, and Pan|Zoom components.

More interesting though are the things they didn’t include. The one that caught my eye was “Guiding with Motion”. For those who have worked with Transitions before, it can be quite a task at times. I did a transiton once that was about 80+ lines of MXML and it would have been nice to work with it visually. Maybe like some of the features in Apple’s Motion product. I wonder if “Thermo” will help me out in that area. Hmmm…

Can’t wait until all is known.

One of the things many developers have told me that they like about working with Flex, is the amount of involvement the community has and how great it is that everyone is helping each other. I’m currently in the process of getting things all squared away with the Orange County Flex User Group I’m involved with and was thinking:

Wouldn’t it be great if there was an AIR application that allowed any user group manage their blog, members, calendar of events, speakers, get direct messages from Adobe, watch remote sessions, etc. surrounding a user group? It could also be an application a member could download to check out any user group in the world. It could make creating and managing a user group really quick and easy.

Doing a little research I found that their seemed to be common patterns in what people did to get their user group put together. There’s usually a blog, sharing of information, like dates, contact info, member info, etc. Recognizing patterns like this is a great way to figure out whether or not something warrants creating an application to cater to certain needs.

We’re using Mango Blog for the OCFlex User Group, which is powered by ColdFusion and could probably be ported over to be used for an AIR app. Not only that, but I know there’s a lot of the other pieces out there we can use to put this together. Now all we need is time.

Anyone interested? Any thoughts?

I was thinking, what would happen if Homestar Runner and the new Photoshop logo had a child? With a little free time and some Photoshop skills I was able to answer my question. I call him Photoshop Runner.

I just caught the mention of an Adobe project, code-named “Thermo”, on MXNA. There’s a post over at pixelconsumption that caught a job position available at Adobe to work on “Thermo”. Nice find, Sam! Basically the description of “Thermo” was this:

“…an innovative new tool, codenamed Thermo, that will enable designers and creatively inclined developers to easily build rich internet applications and interactive content.”

There’s a bit more about it at pixelconsumption, but I have a feeling there might be more information at MAX. Ted Patrick mentioned MAX should not be missed and this alone will make going there well worth it. As it is right now there are so many ways to create UIs for Flex. I’d like to see the process streamlined, simplified and more powerful by making programmatic skinning more easily accessible. This is partly why I got involved with Degrafa, but hopefully “Thermo” will be the answer.

I can’t wait to see what it is and how long before it’s available.

Someone pointed me at John Nack’s blog and mentioned that there was a new Photoshop logo. “Oh yeah, the blue square, that’s old news.” But no, it was yet another revision to the Adobe logo line up. The new logo uses what looks like a speech bubble with a hole in it. As I was looking at the logo someone mentioned that it looked like every Photoshop filter was thrown at the icon. Maybe they were trying to show off the power of Photoshop. You know, like a little piece of Photoshop travelling around every where the name goes.

Looking more at the shape I started to remember something that looked kinda similar. After a little searching I came across a Quark XPress logo that was exactly what I had pictured in my head. It’s not the same thing, but it looks like it could be in the same group of letterforms.

I assume we’ll start seeing this little Photoshop icon used as a little speech or idea bubble similar to the way the Arby’s hat is used. But, besides the thought bubble, I couldn’t help noticing it looked kinda like a toilet paper roll with the end folded creatively, as though it were in a fancy hotel. I couldn’t hold myself back from creating a logo variation, but sparing the inclusion of a tagline.

All-in-all I kind of have mixed feelings about the new logo, but so did other people when the new “element chart” icons came out. Who knows though. We’ll see how the campaign develops and maybe it’ll grow on me.

When rumors began to circulate about the iPhone there were a few killer features I was hoping to see down the line. One was the idea of the iPhone as a powerful remote to control various Apple devices. You know, controlling iTunes on my computer, beam video to a friend’s Apple TV and controlling the device. Maybe even monitor the oil level in my iCar. As Apple integrates their products into our daily lives I can see where something like this could make sense.

I came across this application, called Signal, that allows you to control iTunes from your iPhone. I’ve tried it, it works, and it’s great cause other iPhoners can access and control the host iTunes for a kind of collaborative DJing session. Now if only people could add songs from their iPhone to a queue along with others.

Check out Signal here

I’ve been involved with a lot of things lately, so I just thought I’d share. ScaleNine has been doing great and a lot of the themes featured here have filtered out into a number of Flex projects and Adobe demonstrations. As I’ve been busy, other individuals in the community have contributed to some of the free theme efforts. The UI showcase section is growing at a rapid rate as there have been more adopters of Flex and people have had had the time to develop some sweet apps.

About a couple weeks ago I presented at the LA Flex User Group as a trial run for some of what I’ll presenting at the 360Flex Conference in August. Andy McIntosh, who I’ll be presenting with, and I have been working diligently to put together both an informational session and a hands on session surrounding the topic of “Creating a Visual Experience in Flex 2″. The hands on session will take the methods we’ll be discussing in the informational session and applying it to an app. You can learn more here.

Then there’s Degrafa, another side project. Jason Hawryluk and I have been working on a Declarative Graphics Framework for Flex and things are moving along nicely. It’s awesome seeing what we’ve been able to accomplish so far and are very excited about it’s potential. We’ve only scratched the surface. Check out Degrafa here.

Based on the great experience I had over at the LA Flex User Group I’m in the process of trying to get an Orange County Flex User Group. There’s a couple things holding up the process, but I’m hoping to have more info about that in the near future. I can’t wait to have a local (more local than LA) user group to meet fellow Flexers.

The main thing that I’ve been devoting my full attention to is my full-time job at Atomic Curve. We’re pushing hard to get a huge Flex project we’ve been working on into beta. It’s exciting to be able to see the light at the end of the tunnel. I’ll be able to share more about it in the next few weeks.

Ok, I’ve gotta go catch my breath.

Today the specifics of Adobe’s C3 product offerings were announced and it’s quite a lineup of software. It’s the biggest release of software in the company’s history. I can’t wait to start using the new CS3 products, but what initially caught my attention was the way Adobe’s branding has visually transitioned to include products acquired from Macromedia as well as products developed after that.

Many people have voiced their opinions of likes and dislikes of Adobe’s approach to visually representing their products. However, after seeing the a larger role out of branded packaging it seems to make more sense. It’s almost as if Adobe had to go the route of breaking down their product icons to a very simple form — type, color and shape, part of the core of what Adobe deals with. It’s a lot of products that can work in tandem with each other in a variety of combinations.

Not only that, but dealing with simple aspects in form gives Adobe the ability to make those icons, and their basic constructs, into what ever helps make their products and their connections to each other more understandable. The icons of CS2 may have been more appropriate at the time, but their were much fewer overlaps in the product line. Now, you having things going from Photoshop to Illustrator to Flash and back again in a variety of ways. There’s is an overlapping of workflows from web to print and what better way to represent that than colors and the ways they blend together, like on the new packaging.

Flexibility is also a benefit of having such open-ended icons. Those square icons can grow into bands of color, become three dimensional blocks in an Adobe Rubik’s Cube, easily morph into bars in a chart to represent sales, or break the square shape and rely on the type and color as identifiers.

I’ve also noticed that others who have seen Adobe’s new icons and corresponding color wheel image begin creating their own metaphors for what those icons represent. They are pixels that make up the image of Adobe. They are color swatches making up Adobe’s palette of products. They are elements that make up a atom or DNA like structure. It’s interesting what happens when you take away such descriptive visual elements like those of CS2. People start making their own.

All of this can be seen as advantages that tie in appropriately with Adobe’s “Creative License” statements. The directions this new branding initiative can go are only limited to those behind it and I can only imagine how large this spectrum is really going to get.

Recently several people have inquired about the need to create a mailing list (similar to the FlexCoders Group) dedicated to the customization of UIs for Flex and Apollo. While I think this is a good idea I need to evaluate how great this need is and whether there are enough people who would be willing to contribute. As it is right now it seems new community information pools are popping up more frequently (almost once a week it seems) and in some cases contain redundant information. In some cases it makes it hard to find the information you’re looking for.

Obviously I don’t want to overlap other resources that might be gathering this information, so before I put together a Yahoo Group dedicated to UI customization I also need to make sure there isn’t something out there already that people feel is adequate. The last thing I want to do is fragment the information sources already established.

The topics to be covered would include: app skinning, styling, extending components to get a visual look you want, UI design practices, patterns, etc. for Apollo and Flex. Essentially the goal would be to answer questions from “Why can’t I get a drop shadow to show up on my canvas?” to “How can I make the ComboBox drop down go up instead of down?” to “How do I implement this component I found to distort my application to work?.” Also, the group should be centered on advanced customization of applications either visual or in terms of behavior. What i mean, is that the topic of the group shouldn’t be only about skinning, but about everything related to creating richer interfaces. From very beginner levels to advanced.

Just in case this idea flies (and the name), I created a ScaleNine Yahoo Group. However, I’m looking for ideas for what the name of this group should be and whether or not people feel there is a need for this. If not, hey, it was just a thought

Thoughts, questions, concerns?

UPDATE: I’ve changed the ScaleNine Group to FlexApolloUI Group.