Recent Updates RSS Toggle Comment Threads | Keyboard Shortcuts

  • Dolores 10:30 pm on January 6, 2012 Permalink | Log in to leave a Comment
    Tags: Android ICS Design Tips, Android UI Design, Mobile Design, Mobile UI Design, UI Design, User Interface Design   

    Getting started with Android UI Mobile Design 

    I’ve recently begun to Design a UI for the new Android Ice Cream Sandwich (ICS 4.0.3) platform. I wanted to write a quick post for those mobile user interface designer’s out there who are looking to Design UI’s for the latest Android platform. I found a few great resources that I want to share to help other UI Designers to get started.

    Android 4.0 Platform Highlights

    A good resource you’ll want to read is the Developer Guidelines provided by Android: http://developer.android.com/sdk/android-4.0-highlights.html

    Design for Android Gingerbread

    Photoshop Templates

    First if you want to Design for an Android version prior to ICS (Ice Cream Sandwich) there’s an awesome Teehan+Lax PSD file containing all the UI Elements to help you get started for the Android Gingerbread Version available for download on their website here: http://www.teehanlax.com/downloads/android-gui-psd-high-density/android.

    Android Gingerbread GUI Toolkit

    These GUI Toolkits are awesome for automating your UI Design process. I highly recommend you start there for your mobile UI Designs. Once you get a feel for the layout and flow of your app you can convert the elements to skinned/customized interface pieces.

    Fonts

    For Gingerbread you’ll want to download and install the Droid Sans font.

    UI Design for Android Ice Cream Sandwich (ICS)

    OK, now if you are Designing for Android ICS there’s a couple of really cool toolkits already available to get you jump started.

    First I got the hardware PSD profile; Samsung Galaxy Nexus. There’s an amazing amount of high res. PSD’s out there for you to use as a frame to preview your new mobile UI Design with. Zandog at deviantArt has provided the Nexus PSD file available here: http://zandog.deviantart.com/art/Samsung-Galaxy-Nexus-PSD-271767411.

     

     

     

    Android Phone Hardware PSD Profile

    Android ICS GUI Toolkit Photoshop PSD

    Next you’ll want to grab the GUI Toolkit provided by Ghost301. This toolkit is awesome; it comes in two resolutions 480×800 240dpi and 720×1280 320dpi.

    Don’t let this screenshot fool you. This PSD contains layers for several screen layouts. You’ll love it.

     

     

     

     

     

     

     

     

     

    FONTS

    Next you’ll want to get the Android UI fonts that Google created for the phone. You can download and install those from here:

    Roboto is for ICS and Droid Sans is for prior versions of the UI/

     

    That’s it. These should help you get started quickly on your next Android Mobile UI Designs.

     

    thanks.

     

    Dolores

     
  • Dolores 12:53 pm on June 5, 2011 Permalink | Log in to leave a Comment  

    UI Design Demo Next Week 

    Hi Everyone, I’m going to be hosting a new group meeting next week where I’ll be demo-ing my UI Design techniques in Illustrator and possibly through to Flash Catalyst. I’ll be taking input and ideas from other members. Here’s the info.

    http://www.meetup.com/San-Francisco-GUI-Designers/

    San Francisco Graphical User Interface Designers

     

     
  • Dolores 11:39 am on May 6, 2011 Permalink | Log in to leave a Comment  

    San Francisco User Interface Designers Resources 5/2/11 

    SF GUI Meetup Group

    I’ve started a new meetup group here in San Francisco for other Graphical User Interface Designers and those who are interested in learning more about this topic.

    Here’s a list of Resource links from the topics we covered in our discussion. It was nice to meet you all and I hope to see you at the next meetup. For our next meetup we can dive into demo mode and do a group GUI Design Session. I’ll provide a list of possible Interfaces we could mockup in the coming week. Since we have a range of skill sets this exercise could be fun.

    Skueomorphic UI’s
    Article
    http://www.fastcodesi…

    Gestural
    TED
    Multi-touch interface (from Adobe TED) (Aug 2006)
    http://www.youtube.co…

    User Interface Visualization for Motion Pictures
    Inside Iron Man
    UI Designers/Studio – Pixel Liberation Front
    User Interface Design Article and Audio Clips
    http://www.uiresource…

    Pixel Liberation Front Studio Showreel Iron Man/Speedracer
    http://www.thefront.c…

    Pixel Libreration Front Studio Showreel Terminator Salvation
    http://www.thefront.c…

    Projection Based Interactive UI’s
    respondr
    http://respondr.com/S…

    3D UI In Games
    Engine – Scaleform Flash UI Showreel
    http://www.youtube.co…
    http://www.scaleform….

    Prototyping
    Making Interactive Prototypes Using Fireworks
    http://www.adobe.com/…

    Industry Trends in Prototyping
    http://www.adobe.com/…

    Icon Design

    Pixen
    http://www.macupdate….

    UI Design Patterns
    http://www.smashingma…

    UX Books
    Undercover User Experience
    About Face

     
  • Dolores 12:29 am on March 21, 2011 Permalink | Log in to leave a Comment  

    User Interface Design for Post Releases 

    The keyword for User Interface Design in 2011 has been “Simplify”. Simplification of UI Design seems to occur as a natural part of the User Interface Design and Product Dev. Lifecycle once the initial Branded UI Design has been pushed out.

    The initial UI Design Process for me flows like this:
    Concept–>Sketch –>Discuss–>Mockup–>Rework–>Mockup–>Implement…

    After the first release or two of a software application a new phase of User Interface Design is entered into. This is the phase of gathering user feedback and improving the user interface around it. Also, the UI Design and Dev team have time to look back and evaluate elements in the UI with a more fine grained filter.

    The post release UI Design Process now flows like this:
    User Feedback–>Evaluate–>Rework Original UI–>Review–>Rework–>Implement…

    To give you a litte background, as an independent UI Designer, I would be brought in once the product had enough substance that it was ready for a face i.e. UI Branding Design. I would be presented with an application in its raw state. Purely functional screens that performed specific tasks. It’s a privilege to be brought in at this stage because you get to stretch your creative wings and envision many directions which give voice to the UI.

    Below is an example of my process of taking a raw UI screen and applying a branded look and feel.

    UI Design Stages

    As an in-house Senior UI Designer, working steadily on the same interface, I am presented with a new challenge. Which is to take the existing UI and refine it. Another part of my work involves integrating new features into the current product. As well as take customer feedback and work that in. Customer feedback has been a big challenge because they have proven that the product is so useful that they demand more from the UI than originally envisioned. This is an awesome thing, but can also be a daunting thing. This is what leads me back to “Simplifying UI Design” as the theme of this post. I was presented with the task of stretching the limits of an interface so that is presents more visually but with less noise or complexity. This is the most beautiful kind of complexity in information graphics and visual communication in my opinion. And I went back to my graphic design roots to find answers. Here’s the basic rules of thumb I applied to re-evaluating the User Interface to improve and simplify at the same time.

    Simplifying UI Design

    • Capture the Essence
    1. What is the main action on the page?

    Often times this can become lost with other functions. The UI of TinyURL Keeps this simple. There’s one main action here and one optional. This is the essence of the functionality which can become lost in scope creep.

    • Ask Questions
      1. Are we achieving the main action?
      2. What is the secondary action?
      3. Will it be obvious to the ui what to do?
      4. What happens next?
    • Find What Jumps Out…highlight it
      1. Is the main action the most visible/prominent?
    • Consume More Info
      Research your concepts and compare them to the competition. Do background research on the UI Design Patterns and UI Standards.


    40+ Helpful Resources On User Interface Design Patterns

    • Use Color Sparingly or evaluate color and remove unnecessary elements
      This example illustrates the use of color or “removal” of color in order to simplify the ui. This rule can drastically improve the UI Design by putting focus on the action, allowing the UI to disappear into the background.
    • Reduce Clutter i.e. chrome? Animation?

      This popular image of the evolution of the Photoshop toolbar illustrates that the removal of “chome” – which I consider to be the borders/lines of the tools helps to simplify the UI.
    • Reduce Noise
      Now, with the CS5 release the toolbar is even more simplified with the removal of color..
    • Combine Actions
      Grouping and Nesting elements or actions in a UI can lesson the overwhelming feeling a user can get by the sheer number of actions that can be performed. Photoshop groups tools into sections with a horizontal line and further nests elements into sub-menu items.

    A good place to start when re-evaluating your UI Design once it’s crossed the first release threshold is to refer back to Design basics. Oftentimes, Graphic Design principles, Infographic Design, Design Visualization, and UI Design cross boundaries and offer good direction on how to rework your user interface. I was able to apply these rules to my existing UI Designs and come up with some new solutions.

    Here’s a few more resources you can look in to.


     
  • Dolores 4:37 pm on July 19, 2009 Permalink | Log in to leave a Comment  

    User Interface Animation 

    Designing User Interfaces has always been more exciting to me than traditional Art or traditional Print Design. The reason being, User Interfaces (U.I.’s) combine Graphic Design with Interactivity and Animation. Subjects I’ve studied, worked with, and loved for years. In my new article, I talk about my recent observations in the field of User Interface Animation and cover applying the traditional Principles of Animation to User Interfaces in a few experiments using Flex Builder and Flash. Click here to read the full article.

     
  • Dolores 10:02 pm on December 28, 2008 Permalink | Log in to leave a Comment  

    Pre-viz for Chat Application UI/User Experience (Login/Inbox) 


    (Play Quicktime Movie) Pre-viz for Chat Application User Interaction v01 by Dolores Joya 08

    The practice of making a Pre-viz (lookup definition) to map out and think thru a complex sequence of events prior to executing them, has been around in Hollywood for awhile. Emerging RIA technologies like Adobe Flex and Silverlight are finally bridging Design and Development pipelines to blend 3D, Interaction, Animation and Applications into a rich seamless user experience.

    This example is my creative thoughts on how the user experience for a Chat Application could be when a user is alerted to take an action and logs in to receive new messages. The bouncing icon indicates user action is required. Potentially, I believe the user would already be logged in. The background should really be the user desktop. I removed all the traditional chrome of the browser and application window (which I think may become a standard practice in the future for entertainment/social networking type apps. Video players already do this.). Just in doing this short pre-viz I had many realizations of what could and probably could not be done. Also, I had many more new ideas to wow and lull the user into interacting more with an interface.

    With the help of Maya and After Effects, I’m finally able to get these thoughts down on screen. I did try to execute this concept with keyframed SWC’s embedded in Flex components, thru timeline animation in Photoshop and Flash. In the end, the Maya/After Effects combination seemed to offer the most direct route to executing my concept.

    I believe the future of User Experience Design, Interactivity, RIA’s, User Interface Design and other interactive mediums will have the Designer move into pre-vizing the interactivity after or parallel to Photoshop mock-up stage. In my experience the static Photoshop mock-up doesn’t reflect the life or UX of the application and pre-viz can fill that void. Currently, many teams already do a pre-viz prior to development usually in Powerpoint or After Effects. The addition of Autodesk Maya will come into play when more user experiences are built Papervision 3D. Now that Flash Player 10 supports more 3D and Photoshop and After Effects support more 3D and Maya supports Photoshop files the pipeline seems to be linking up nicely.

     
  • Dolores 11:38 am on November 25, 2008 Permalink | Log in to leave a Comment  

    3D Rose Shader Network & Collada Dae 

    Platonic Solid Rose

    Platonic Solid Rose

    I’ll forever be a student of 3D and continue to study Computer Graphics. It’s my belief that 3D will merge with Web/Devices/Interfaces and other Technologies we interact with in the future, so pursuing 3D has been part of my study for the last 10 years and will continue to be in the future. Software Applications, Processors, Bandwidth, and the Programming Capabilities that are coming to light in recent years has been amazing to watch.

    Here’s a look at what I’m working on currently. This work includes concepts of Setting up Shader networks, Displacement maps, and Exporting Collada Maya FBX .DAE’s from Maya 2009.

    I started with a platonic solid primitive from the polygon menu in Maya 2009. I left the shape with the default settings. My plan for this project is to doing nothing other than understand shader networks and connecting shader nodes within the Maya Hypershade window and to just HAVE FUN.

    Platonic Solid Polygon Primitive

    Platonic Solid Polygon Primitive

    I applied a base shader to my platonic solid to start. In Maya there’s many shaders to start from. I use the “Layered Shader”.

    PLEASE NOTE: Upon export to COLLADA.dae the Maya 2009 FBX.DAE exporter doesn’t support the Layered shader, so my platonic solid was stripped of this shader and assigned a default Lambert :( = Weak. So the .DAE is just the solid with a basic shader.

    Quoting from a book I am currently reading “Advanced Maya Texturing and Lighting” by Lee Lanier (Excellent).

    A Definition of Shaders

    A shader is a program used to determine the final surface quality of a 3D object. A shader uses a shading model, which is a mathematical algorithm that simulates the interaction of light with a surface.

    Connecting Nodes in the Maya Hypershade Window
    In the spirit of experimentation I add a Cloth texture and a Ramp Texture (a type of Gradient) with the type set to Tartan to the Layered Shader. I also add Cloth to serve as the Displacement Channel to the polygon object.

    An explanation of nodes from Lee Lanier is very well put as follows…

    The Hypershade window allows the connection of various Maya nodes. Technically speaking, a node is a construct that holds specific information plus any actions associated with that information. A node might be a curve, surface, material, texture, light, camera, joint, etc…

    Here’s a look at my Shading Network in the Maya Hypershade Window.

    Rose Shader Network

    Rose Shader Network

    Here’s a look at the render with some minor editing in Photoshop. You can download and work with this file for your own creative endeavors.

    Platonic Solid with Layered Shader Rendered and Edited in Photoshop.

    Platonic Solid with Layered Shader Rendered and Edited in Photoshop.

    I exported the polygon object as a COLLADA fbx/dae out of Maya 2009. There’s not a COLLADA plugin available yet for this version so I use Maya’s built in exporter. Like I said the exporter didn’t keep my shader but here’s a look at the .DAE file in notepad.

    COLLADA Dae Export from Maya 2009

    <?xml version="1.0" encoding="utf-8"?>
    <COLLADA xmlns="http://www.collada.org/2005/11/COLLADASchema&quot; version="1.4.0">
    <asset>
    <contributor>
    <author></author>
    <authoring_tool>FBX COLLADA exporter</authoring_tool>
    <comments></comments>
    </contributor>
    <created>2008-11-25T16:06:42Z</created>
    <modified>2008-11-25T16:06:42Z</modified>
    <revision></revision>
    <title></title>
    <subject></subject>
    <keywords></keywords>
    <unit meter="0.010000"/>
    <up_axis>Y_UP</up_axis>
    </asset>
    <library_materials>
    <material id="layeredShader1" name="layeredShader1">
    <instance_effect url="#layeredShader1-fx"/>
    </material>
    </library_materials>
    <library_effects>
    <effect id="layeredShader1-fx" name="layeredShader1">
    <profile_COMMON>
    <technique sid="standard">
    <lambert>
    <emission>
    <color sid="emission">0.000000 0.000000 0.000000 1.000000</color>
    </emission>
    <ambient>
    <color sid="ambient">0.500000 0.500000 0.500000 1.000000</color>
    </ambient>
    <diffuse>
    <color sid="diffuse">0.500000 0.500000 0.500000 1.000000</color>
    </diffuse>
    <transparent>
    <color sid="transparent">0.000000 0.000000 0.000000 1.000000</color>
    </transparent>
    <transparency>
    <float sid="transparency">0.000000</float>
    </transparency>
    </lambert>
    </technique>
    </profile_COMMON>
    </effect>
    </library_effects>
    <library_geometries>
    <geometry id="pSolid1-lib" name="pSolid1Mesh">
    <mesh>
    <source id="pSolid1-lib-Position">
    <float_array id="pSolid1-lib-Position-array" count="36">
    0.850651 0.000000 -0.525731
    0.850651 -0.000000 0.525731
    -0.850651 -0.000000 0.525731
    -0.850651 0.000000 -0.525731
    0.000000 -0.525731 0.850651
    0.000000 0.525731 0.850651
    0.000000 0.525731 -0.850651
    0.000000 -0.525731 -0.850651
    -0.525731 -0.850651 -0.000000
    0.525731 -0.850651 -0.000000
    0.525731 0.850651 0.000000
    -0.525731 0.850651 0.000000
    </float_array>
    <technique_common>
    <accessor source="#pSolid1-lib-Position-array" count="12" stride="3">
    <param name="X" type="float"/>
    <param name="Y" type="float"/>
    <param name="Z" type="float"/>
    </accessor>
    </technique_common>
    </source>
    <source id="pSolid1-lib-Normal0">
    <float_array id="pSolid1-lib-Normal0-array" count="36">
    0.850651 0.000000 -0.525731
    0.850651 -0.000000 0.525731
    -0.850651 0.000000 0.525731
    -0.850651 0.000000 -0.525731
    -0.000000 -0.525731 0.850651
    -0.000000 0.525731 0.850651
    0.000000 0.525731 -0.850651
    -0.000000 -0.525731 -0.850651
    -0.525731 -0.850651 0.000000
    0.525731 -0.850651 -0.000000
    0.525731 0.850651 0.000000
    -0.525731 0.850651 0.000000
    </float_array>
    <technique_common>
    <accessor source="#pSolid1-lib-Normal0-array" count="12" stride="3">
    <param name="X" type="float"/>
    <param name="Y" type="float"/>
    <param name="Z" type="float"/>
    </accessor>
    </technique_common>
    </source>
    <vertices id="pSolid1-lib-Vertex">
    <input semantic="POSITION" source="#pSolid1-lib-Position"/>
    </vertices>
    <polygons material="layeredShader1" count="20">
    <input semantic="VERTEX" offset="0" source="#pSolid1-lib-Vertex"/>
    <input semantic="NORMAL" offset="1" source="#pSolid1-lib-Normal0"/>
    <p>1 1 9 9 0 0</p>
    <p>0 0 10 10 1 1</p>
    <p>0 0 7 7 6 6</p>
    <p>0 0 6 6 10 10</p>
    <p>0 0 9 9 7 7</p>
    <p>4 4 1 1 5 5</p>
    <p>9 9 1 1 4 4</p>
    <p>1 1 10 10 5 5</p>
    <p>3 3 8 8 2 2</p>
    <p>2 2 11 11 3 3</p>
    <p>4 4 5 5 2 2</p>
    <p>2 2 8 8 4 4</p>
    <p>5 5 11 11 2 2</p>
    <p>6 6 7 7 3 3</p>
    <p>3 3 11 11 6 6</p>
    <p>3 3 7 7 8 8</p>
    <p>4 4 8 8 9 9</p>
    <p>5 5 10 10 11 11</p>
    <p>6 6 11 11 10 10</p>
    <p>7 7 9 9 8 8</p>
    </polygons>
    </mesh>
    </geometry>
    </library_geometries>
    <library_lights>
    <light id="pointLight1-lib" name="pointLight1Mesh">
    <technique_common>
    <point>
    <color sid="color">1.000000 1.000000 1.000000</color>
    </point>
    </technique_common>
    <technique profile="MAYA">
    <intensity sid="intensity">1.000000</intensity>
    </technique>
    </light>
    <light id="pointLight2-lib" name="pointLight2Mesh">
    <technique_common>
    <point>
    <color sid="color">1.000000 1.000000 1.000000</color>
    </point>
    </technique_common>
    <technique profile="MAYA">
    <intensity sid="intensity">1.000000</intensity>
    </technique>
    </light>
    </library_lights>
    <library_visual_scenes>
    <visual_scene id="RootNode" name="RootNode">
    <node id="pSolid1" name="pSolid1">
    <instance_geometry url="#pSolid1-lib">
    <bind_material>
    <technique_common>
    <instance_material symbol="layeredShader1" target="#layeredShader1"/>
    </technique_common>
    </bind_material>
    </instance_geometry>
    </node>
    <node id="pointLight1" name="pointLight1">
    <instance_light url="#pointLight1-lib"/>
    </node>
    <node id="pointLight2" name="pointLight2">
    <translate sid="translate">0.632895 0.000000 0.598610</translate>
    <instance_light url="#pointLight2-lib"/>
    </node>
    </visual_scene>
    </library_visual_scenes>
    <scene>
    <instance_visual_scene url="#RootNode"/>
    </scene>
    </COLLADA>

    Download the zipped file containing the layered Photoshop file with the render and experiment yourself. Also in this file is the COLLADA dae.

    Download Rose 3D dae/psd.

     
    • samij 11:24 am on December 20, 2009 Permalink

      great render – love the combo of colors..

  • Dolores 4:57 pm on November 14, 2008 Permalink | Log in to leave a Comment
    Tags: 3D Animation, Flash Animation, Flex Skinning Experiment, Interactive Animation.   

    Flex + Flash + Maya + zBrush 

    Here’s an experiment I did with some of my favorite Computer Graphics tools mashed up to together. I’ve been working heavily in Pixologic’s zBrush (Awesome 3D Sculpting) and Maya 2009 (Out of Control Animation) when I’m not creating out Flex UI Designs and Flash Skins. Ultimately, I want to push everything together to create innovative and inspirational user interface widgets and what-not. So here is the output from those pipelines melded into a wicked skull.

     

    Flex + Flash + Maya + zBrush

    Flex + Flash + Maya + zBrush

    Here is the original zBrush Sculpt. This is the version I intended to use in my Maya Animation but I’m still figuring out Displacement Maps in Maya/zBrush.

    zBrush Sculpt of Skull by dolores joya moore

    zBrush Sculpt of Skull by dolores joya moore

     
    • Daniel_Warner 10:16 am on November 19, 2008 Permalink

      That rotating sparkly skull thing is amazing. I’ve recently found zBrush and have been getting into the 3D stuff. Have you used lightwave or blender? Your posts may be rare but they are always super-relevant. Thanks for sharing… great stuff!

    • admin 10:25 am on November 19, 2008 Permalink

      Hi Daniel,

      Yes, I’ve tried both Lightwave and Blender. I’ve also experimented with Modo, Cinema4D, 3D Studio, Bryce, Vue, Poser, Swift 3D. I’ve done a lot of comparison to say the least.

      I must say Blender is such a good program for being free. I just happened to get a personal learning edition of Maya 6 years ago and began training on it. I’m still learning Maya to this day.

      Thanks.

  • Dolores 5:38 pm on July 31, 2008 Permalink | Log in to leave a Comment  

    Fixing the Flash CS3 Flex Skin Template classpath Bug 

    I’ve been using the Flex Component and the Flex Skinning Templates for Adobe Flash CS3 for awhile now. I couldn’t figure out why Flash CS3 would throw up this error at certain times:

    A definition for the base class could not be found in the classpath. Please enter the name of a class that is defined in the classpath, or enter the default base class ‘flash.display.MovieClip’.

    Today I found the answer in the comments of the Flex Community Blog post about “Turning Flash CS3 assets into Flex Components“.

    If you’re using the Skinning Templates by Adobe to create new skins for your project you’ll want to pay attention to this little item during your workflow.

    I usually open the Flex Skinning Template in Flash CS3 via the “New” dialog box.

    In the example of skinning a Flex Button Component. Once I open the Flex skinning template, I duplicate the symbol in the library because more often than not I will be creating multiple Flex Skin’s for a single Flex Button Component.

    If you’ll notice below in the “Symbol Properties” dialog box the default Base class for the component is “mx.flash.UIMovieClip”

    If you duplicate the symbol (see below), Flash CS3 changes the Base class to “flash.display.MovieClip”.

    The thing to note here is if you publish your file and import the new skin into Flex Builder, your skin states will automatically play like an animated gif. Also, if you try to type in the “mx.flash.UIMovieClip” Base class path you will get the error message above.

    The admin on the Flex Community blog today resolved this for me in his comments on this post and quoted below for clarity.

    “I’m sorry, It appears I have mislead you with an error. I went through my steps from the beginning, and found that you need to set the base class as flash.display.MovieClip. Flash then automatically changes it to mx.flash.UIMovieClip after you click commands -> convert symbol to Flex component. You can see this change if you go to the linkage window for the symbol after you create a Flex component from it. I’m sorry for the frustration, I try to keep these articles as error free as possible, but this one slipped through. Try this and let me know how it works for you.

    If you still have a problem, let me know before googling your eyes out further (I know how that is), and I’ll help you get it. It’s a great tool.

    P.S. I have corrected this in the article.”

    So if you encounter this problem when you are trying to bring in an animated Flash skin into Flex, converting the symbol to a Flex component command could help. See below.

    Thanks Admin, I’m not sure who you are but you helped me a lot today.

     
    • Flex Community 8:46 pm on July 31, 2008 Permalink

      Glad I could help, thanks for the mention.

    • Carvalhar 2:28 pm on December 27, 2008 Permalink

      hi!

      i’m skining an Accordion component(actually a HAccordion) in flash but the skin plays, as a gif…i tried to convert it to flex component, as you say, but it still plays.

      I tried also to put a stop(); action en each frame label, it works, no play, but it also doesn’t change the state with rollover…do you know how can i resolve this?

      can we set for component a base skin and plus, a frame label?

    • admin 8:51 am on December 29, 2008 Permalink

      Hi Carvalhar,

      Did you export as SWF or SWC? I have had better luck exporting skinned components as SWC files from Flash. I would use that format instead.

    • Carvalhar 3:49 am on December 31, 2008 Permalink

      yeah, as swc…when i use a simple Accordion it works fine, but with HAccordion, so i think it’s a HAccordion problem.

      i could get it working making thousands of skin with only one frame for each state :(

  • dolores 1:58 pm on July 19, 2008 Permalink | Log in to leave a Comment  

    Flex + Flash + Maya for 3D UI button controls 

    3D is a passion of mine. I’ve been doing some experimenting exporting 3D rendered stills from Maya to Flash and then finally to Flex. I like the concept of creating GUI elements that are squashy, transformed or deformed in some way. I’m hoping to create an entire interface with 3D elements. Maybe blend these elements with video for a Game like experience? We’ll See…Here’s where I am so far.

    3D Rendered GUI Flex Skinned Components

    Rendered 3D Flex Skins


     
    • pennysavage 1:38 pm on October 8, 2008 Permalink

      I luuuv the squishy interactive feel of your buttons! It rocks!!

c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
l
go to login
h
show/hide help
esc
cancel
Buy phentermine no prescriptionBuy generic cialis generic cialisCialis orderGeneric viagra from canadaPropecia uk onlineDose of prednisone