Here you can find a small set of styled buttons : ArrowLight, ArrowDark, ArrowLightColor, ArrowDarkColor. That best suits for: controlling an image gallery, switching between application pages, detail views, scrolling the list and so on.

Description:

ArrowLight

Uses only one color for background that you can set through Background="White". States change by increasing/decreasing the opacity and/or displaying the white shadow.  This style suits for dark or bright areas.

ArrowDark

Uses only one dark/bright color for background that you can set through the Background property, for example Background="#FFFCCE56". States change by increasing/decreasing the opacity and/or displaying the grey shadow effect.  This style suits for white or light areas.

ArrowLightColor

Uses two colors. Set the Background property for the “Normal” state and “Foreground”  - for the “MouseOver” State (White and  #FF269B7B, for example). States change by increasing/decreasing the opacity of both colors and/or displaying the white shadow.

ArrowDarkColor

Uses two colors. Set the Background property for the “Normal” state and “Foreground”  - for the “MouseOver” State (#FF269D7B and  #FFFCCE56, for example). States change by increasing/decreasing the opacity of both colors and/or displaying the gray shadow. This style suits for white or light areas. Use opposite, bright colors for “Normal” and “MouseOver” states.

Links:

• Demo project
• Download ArrowStyles
• Download demo

My renewed wallpapers for Visual Studio 2010.

1280x800

1920x1200

There are several ways to create SketchFlow prototypes. You can draw sketches, scan them, import to Expression Design/Adobe Photoshop, make some fixes, import separate pieces to Expression Blend, create animation and so on. This way is beautiful, creative but too long. Another way allows you to create functional prototype directly in Expression Blend by using default sketch styles and sample data. You can get a real prototype with sketch styles but with real images.

So it would be nice to create a third edition. Take real pictures, illustrations, photos and add sketch effects. Why not? You can create these effects and apply to different collections: people, auto, furniture.

Take a look at these examples I made in Expression Design for ReMIX10:  

Original:

With effects:

So you can get such SketchFlow prototypes with sketch images:

You can copy effects by using Attribute Dropper . That tool copies the effect from an existing object to another object.

The best combination is Poster Edges + Note Paper  or  CrossHatch + Note Paper. Hope you like it too:). 
Enjoy -> Expression Design Sketch Effects.

Let’s talk about abstract background image. Find out how to create one of them with a small dot and some interesting operations in Expression Design.

And so, what do we need? Create a New Document 800x600 px and add a Rectangle of the same size. Fill the shape with a gradient - from the rich dark color to the light and bright.

For example, somehow like this.

I chose two gradient colors: #65fef6 and #008a7c. After filling, lock this shape in order not to shift it accidentally. You can do this in the Layers panel by clicking the padlock icon.

Dot.The dot is a small circle, a circle is an ellipse and ellipse is a ...  So, don’t worry and just choose Ellipse tool for drawing. And create a small dot with sizes 10х10 pixels and fill it with a white color (Don’t be afraid of sizes on a screenshot. This dot is really small, I just used Zoom to change the scale).

Another dot . It’s not a problem for you to make another dot. Simply Copy and Paste this shape. Also increase the size twice - this dot needs to be 20x20 pixels.

Dot the i's. Place dots at the great distance from each other, the small dot on the top of the artboard and the big one at the bottom.

Align horizontal centers. Now it is important to align objects with each other. Choose Selection tool and select both dots or just press CTRL + A (in our case we select only dots, because the background is locked). And in the Action Bar panel from the Arrange menu, point to Align, and then click Horizontal Centers. Now the center-points of both dots are aligned.

Blend paths. Don’t cancel the selection of objects.  In the Object menu, click Blend Paths. In the Steps field of the opened dialog box, enter the number 22 (from 20 to 30 – depending on distance between your dots). Make a choice after simple calculations: after applying the operation Blend Paths, bottom dots must touch each other a little bit, and top dots must be at a greater distance, as in this example.

After the previous operation there is a new group of objects in the Layers panel.

 
Press CTRL + A to select all objects. (Two our dots and a new group) From the Path menu of the Action Bar apply command Unite.

 
This command combines all the selected shapes into one compound object. (We've done this to simplify our future work).

Repeat. Now we are going to do the similar operation as stated above, but only in horizontal way. Move the object to the left edge of the background, Copy (CTRL +C) and Paste in Front (or press CTRL+F). Click the mouse, and begin to drag the object horizontally to the right edge while holding down the SHIFT key for precise horizontal alignment.

Select our two objects again and perform the operation Blend Paths. The number of steps is 45 (choose by the same principle as above).

We’ve got the picture:

Then, press CTRL + A again to select all objects (two objects - left and right and a new group).  From the Path menu of the Action Bar apply command Unite.

Fill. Now we are going to apply a gradient fill. You can select the same color as for background and experiment with Gradient Transform tool

OR you can select for gradient two white colors and make one of them a fully transparent and another one - completely opaque.

Then use Gradient Transform tool to set the direction from top to bottom. And as a result there is a nice transition of dots. Remember, we had only one at the beginning :)

The result is in the attached file.

dots.zip (76.68 kb)

Recently I shared Redstyle Template for Expression Web with members of the Expression Community. Many of you asked me about original .design file. So, why not? You can download it here.

Sincerely,
Helen. 

Would you like to extend your navigation panel with new functionality, but haven’t proper icons? I created simple draft set of mini icons for Silverlight Navigation Application and Silverlight Business Application. Open file in Expression Design, choose an icon, export to xaml and use in your project :)

Colors of this set are Black&White and Black&Green. In any case, you can change colors.

List of icons:
Folder, Document, Documents, Tree,
Add to DB, Remove from DB, Edit DB structure, Search in DB,
Down, Up, Right, Left,
Stats, Tools, Filter, Refresh,
Info, Search, Zoom out, Zoom in,
Lock, UnLock, Person, Cloud,
Draw, Measure, Relation, Drag.

100% Zoom preview:

200% Zoom preview:

Custom zoom preview:

View some icons in action

SNA_Mini_icons_v2.zip (68.28 kb)

Inspiration comes from many sources. I reviewed my old photos with lunar eclipse and decided to create new Silverlight wallpapers.

As well “See The Light” was an inspiration to me:) You can see the result below. All made in Expression Design. Enjoy!

seethelight_1024_768

seethelight_1280_1024

seethelight_1280_800

seethelight_1440_900

All in one archive

Recently I posted a lovely list of design quotes. Just read part 2. Most of them I found at Flickr Group “’Design Is’…Wallpaper”, you can get design wallpapers with quotes there.

• Design is staying up all night and moving an image two picas.
  
• Design is balance.
  
• Design is knowing when to stop … designing.
  
• Design is simple.
  
• Design is something a programmer should not do.
  
• Design is 1% inspiration, 99% perspiration.
  
• Design is not just do something looks good.
  
• Design is about being a Geek, but with style.

And final:

• Design is what everyone sees but few recognize.

Find inspiration in quotes. Just read and imagine. I found some of them are really cool. How about you?

• Design should never say, “Look at me.” It should always say, “Look at this.”  (David Craib)
  
• Design is an opportunity to continue telling the story, not just to sum everything up. (Tate Linden)
  
• Designers are meant to be loved, not to be understood. (Fabien Barral)
  
• Behavioral design is all about feeling in control. Includes: usability, understanding, but also the feel. (Don Norman)
  
• Technology over technique produces emotionless design. (Daniel Mall)
  
• The difference between a Designer and Developer, when it comes to design skills, is the difference between shooting a bullet and throwing it. (Scott Hanselman)
  
• It’s really hard to design products by focus groups. A lot of times, people don’t know what they want until you show it to them. (Steve Jobs)

With Microsoft Expression Blend 3 Preview, you can create Windows Presentation Foundation (WPF) applications for the desktop and Microsoft Silverlight 3 applications for the web.

Expression Blend 3 Preview is a major new release, taking the product in a number of new, important directions, such as on-the-fly sample data generation. We also added support for several Silverlight 3 features.

Expression Blend 3 Preview is a step on a long journey toward tools that are meant to empower designers to participate in the process of software creation in deep, meaningful, and creative ways.

Using Expression Blend 3 Preview, you, the designers, can make computers easier and more fun to use, and can delight customers with great applications and great content.

Read more at Expression Blend 3 Preview