In this tutorial we will take a look at how to create your own, custom buttons in Yooba Studio.

1. Start by adding a button to the scene. Click on "Add, Objects, Button" in the toolbar:
   
   
   
   
2. The button will appear on the scene, allready selected:
   
   
   
   
3. In the settings panel for the button, click on the "Change Style..." button:
   
    
   
   
4. This will bring up the "Component Styles" dialog. There are many pre-defined styles to choose from, and you can easily change colors, fonts etc.
   For custom buttons, scroll down and select the style called "Custom Skin", as shown in this figure:
   
   
   
   The button will now look like this on the scene:
   
   
   
   
5. Continue by clicking the "Change Skin..." button in the panel:
   
   
   
   
6. This will bring up the "Button Skin Settings" dialog. In this dialog you specify which images to use for the your button. A custom button have three states: UP (normal), OVER (mouse cursor is over the button) and DOWN (mouse button is pressed), and you can specify a different image for each of these states. If you like, you can use the same image for more than one state. Click each "Select..." button to choose an image from the Library to use.
   
   
   
   You can also specify a "Scale Grid" for the button. As shown in the figure above, only the area inside of the green grid will be scaled when the button is resized. This can be very useful when you have a buttons with a border that you don't want to affect by scaling the button. The grid is specified by setting the values for each respective side, left, right, top and bottom.
   You can skip this part for now if you like, it's not neccessary for the button to work.
   
   You can test the button directly in this dialog by simply clicking on it. After you have selected images for each state, click the "Close" button.
   
   
7. The button will now show the image selected for the UP state:
   
   
   
   Test-run the project by clicking "Preview" in the Toolbar and try out your new, custom button out!

 

I hope you enjoyed this tutorial, see you again next time!

Tags: yooba studio, studio, buttons, custom, tutorial, step-by-step

Included in the soon-to-be-released new version of Yooba Studio is the possibility to set gradient fills on shapes. This feature will allow you to get even more creative with the stuff you build in Yooba Studio. Below is a preview of the new and improved shape panel, showing the gradient settings.

Stay tuned for more info on the next release of Yooba Studio!

Tags: yooba studio, studio, shape, gradient

We've had the account for quite some time, but never had the time to seriously get started. So here's another attempt: http://twitter.com/yoobastudio

 

As you've come here, we think it might be good to see there as well.  

Tags: social media, yooba studio, twitter, web 2.0

The service provider for CMS - EPI Server, has made a survey on what, consumers/visitors are most likely to look for, or need on a web site. Four out of ten leave a site, or terminates a transaction as they don't get the help they need, or the information they seek for.

According to EPI Servers survey these elements are important on a site:

1. A manned chat.
2. The possibilty to give feedback straight from the site.
3. To be able to get in touch with other customers/users/members.
4. To get customised offers based on previous purchases.
5. To get a pop-up screen, asking if you need any help.

 

I'm not sure what to make out some of those points, and it might not be the most relevant thing either. The main point is to make it easy for your customers. We've been on the case previously. From an personal experience it happens to me all the time. For example some retailers, makes it hard for me to purchase a product on their site.

- Why? I don't think any business is in the position to neglect customers today. Give me a good (visual) presentation of the product, and after i put it to my basket, make it easy for me to go trough with the transaction. 

Source: Dagens Media (In Swedish)

Tags: visualisation, e-commerce, dagens media, epi server, cms,

As stated in the previous post, sub scenes is a new feature in Yooba Studio. A sub scene is displayed on top of another scene, and can be very useful when making content that require multiple similar pages. In this tutorial, we will make a simple gallery to get you started with sub scenes. The tutorial is intended for users who are already familiar with Yooba Studio.

1. Open a blank project in Yooba Studio. In the scene manager, select the first scene. Click the 'plus' sign at the bottom of the scene manager and choose 'Sub Scene' from the menu.

2. A sub scene is added to the list of scenes. A regular scene can have multiple sub scenes, so go ahead and add a few more sub scenes to the scene.

3. In 'Scene 1', add some graphical elements that will be used as a background in your gallery. Also, add the two buttons that will be used for navigation.

4. Select the first sub scene, and add an image from the library to the scene. As you'll notice, the underlying regular scene is still shown beneath the sub scene. This makes it easy to put the image in the right position on top of your background. Add an image to each of the remaining sub scenes as well. Tip: A sub scene can have its own transition and in- and out-animations, and it can also contain form objects.

5. To make a sub scene appear, and to navigate between sub scenes, you use actions. There are two types of actions that can be used to reveal sub scenes: Scene Actions and Sub Scene Actions.

On 'Scene 1', select one of the buttons you've added. On the actions panel, choose Sub Scene Actions. In the list below, you can now choose between the avilable actions: You can navigate to the next or previus sub scene, you can hide the current sub scene, or you can choose a specific sub scene to show. Choose 'Show Next' for one of the buttons, and 'Show Previous' for the other.

6. When you navigate to a regular scene, by default no sub scene is shown. Therefore, if you preview your project now, only the background and no image will be displayed.To make the first image show when the project starts, we'll use an action on the scene. Select 'Scene 1', and look on the 'Action Settings' panel. This action is executed when the scene is shown. Choose 'Sub Scene Actions', and select 'Sub Scene 1'.

7. Preview the project. Now the first image will show up, and by clicking on the buttons you can navigate to the other images. Feel free to add animations and transitions as you wish.

 

Keep in mind that this was only a simple demonstration of sub scenes - it can be used for much more advanced projects as well. Good luck!

Tags: tutorial, sub scenes, features

We made a short appereance at Creative Day in Stockholm last week. It was good. We had good feedback and great interest from relevant users. We've been really busy for the past months, which means lots of work and less public appereances. This spring we're certainly going to come out more, spreading the news. Keep an eye on this blog, or get in touch for new communication- and business ideas.

Tags: creative day, yooba studio, in-house, communication, business

Version 1.2 of Yooba Studio has just been released! The two main features of the new release is Sub Scenes and Zoom, and we have also made a bunch of smaller fixes and improvements in all areas of the application.

Zoom
To zoom in on the work area, use the zoom tool that sits in the bottom-left corner of the work area. You can either choose a zoom level from the menu, or type a value directly into the textbox. You can also use keyboard shorcuts to set the zoom level:

CTRL-0 - Fit To Window
CTRL-1 - 100%
CTRL-2 - 200%
CTRL-3 - 300%
CTRL-4 - 400%

Hope you'll find the zoom feature useful in your day-to-day work! And stay tuned for a post about how to use the other new feature, sub scenes...

Tags: new release, zoom, sub scenes, features

What happened to them? They usually occur in the end of the year, and are occasionally interesting and entertaining to get into. This year, or last year, they past by unnoticed. I don't know if the writers where busy doing other work than predictions, or if I were too busy with our business. Anyway, with a bit of spare time (still working though) I found a list (and a half) that'll share with you.

We'll see if, when, I'll have the time to go through some of them. Again, they're more of interesting character, rather than influential of useful. Especially in these times where you need to be really pragmatic and effective as possible with your work and strategies. 

Tags: digital marketing, trends, predictions, 2009, yooba studio