Well it’s been pretty quite on AGkDesign.blog, but its for good reason! For the last few weeks, in between some crazy projects I have been working on, I have been slaving away to create SilverZine. It’s an on-line resource for Designers that are working with Silverlight. We hope to add heaps of awesome content over time and create a really great resource to help get people started with Silverlight and provide the more experienced Designers with some ideas and new techniques to try out!

And today I’m very proud to announce that SilverZine is finally live!!!!

Thanks to all the help everyone has given me and don’t forget to drop us a line over at SilverZine sometime

Thanks

Alex

Today I announced that SilverZine.com was coming and included a link to the site, since then the SilverZine twitter has been on fire, so to keep the momentum rolling I thought I would organise a little sneak peek on what SilverZine is!

I have been thinking about this for a while now and I have finally stepped up to the challenge.

There are plenty of sites out there dedicated to Silverlight, but being a designer myself, I have found there is not a lot of design orientated ones.

Enter SilverZine!

SilverZine is a community resource that will allow designers to find tips, tricks and inspiration for their Silverlight projects or get their name out there with something they have put together themselves. Basically it’s a resource for designers who work with or are interesting in working with Silverlight.

With that said, developers are most welcome as well, although it will not be a code heavy website, you might find some cool inspiration for the look of your next interface/application or grab one of the free resources we plan to have available as time goes by.

Let me know your thoughts and things you might be interested in seeing on the site.

http://www.silverzine.com

and don’t forget to hook up with the SilverZine twitter to keep up to date with its progress

Thanks everyone

Alex

I whipped up a quick demo last night using Silverlights 3 and Expression Blends new tools. This demo should help get some ideas flowing hopefully. I did for me!

See the Demo! – Hover over the panels to bring them into focus

If you don’t have Silverlight 3 installed, Grab it here (it’s in the right hand side panels).

This demo uses:

Built using

• Expression Blend 3 Mix Beta
• Silverlight 3 engine

Pixel Shaders

• Drop Shadow (added to buttons and spinning animation)
• Blur (added to shadows and canvas

Transform attributes

• Scale
• Project

Out of browser

The project also includes the save to desktop option, to see this in action, right click on the silverlight application and select “Install Projection Demo on this computer” and then to uninstall the application at a later date, simply open it up and right click again selecting Uninstall/Remove.

Hope you enjoy the demo and if you have any questions just drop me a comment.

Oh and B.T.W don’t think this is everything the new Silverlight has to offer, there is sooo much more!!!! These are just a few things I have been playing with.

Thanks

Alex

Since the release of Expression Blend 3 and Silverlight 3 yesterday at Microsoft’s Mix09, there has been heaps of buzz around all the awesome new features and changes to the product, the one I wanted to mention today was Silverlight on the desktop.

You can now run Silverlight applications offline and on the desktop. This is a huge step for Silverlight and giving developers the ability to make a great web based application that also serves as a normal desktop application. Best bit of all? Its really easy to make your application down-loadable to the desktop and even easier for users to save and delete it.

Lets have a quick look at it…

With some small additions to your application.xml like adding information for the icon, name and description of the application and its ready to go.

Inside the Silverlight application when its running, Right click to see the install option

Once you have chosen to install the app you have a few choices about the install

Click OK and your done, you app will be installed in the start menu, desktop or both

Then if you wish to get rid of the application, open it back up (either the web version or the version installed on your desktop) and right click again.

How easy is that!

This of the possibility this could add to your application, and this is only the start, there are so many other awesome features to look at and I will do my best to show them to you as soon as possible.

I will also post a tutorial soon on how this is achieved.

Thanks

AGKDesign.net

My new Silverlight Site is live, I thought it could use a little attention.

Let me know what you think.

Thanks

Alex

I have always liked using half shadows to break up sections of websites but in order to bring it into my Silverlight designs I have had to create PNG’s and import them into my Silverlight projects. This way has been fine but if you could create the same effect using simple XAML you would be able to create a smaller (file size) and a lot more flexible!!!

… so thats what I did…

To create this effect just open up Expression Design and create a new document.

Create a oval shape which is much taller than wide. its about 400px high and 25px wide.

Next up, apply a gradient to your oval. We need to set the gradient to Radial 

and it needs to go from black to black,

with the second stop of the gradients alpha set to 0%.

Should look at bit like this

Now we need to edit the gradient to create the effect we want by editing the gradient properties.

I’m setting the height of the gradient to about 2.5%. (remeber to unlock the constraints between your height and width of the gradient by clicking the link icon in between them)

Ok now we just need to edit the shape of the oval to cut off half of the gradient.
Use the direct select tool to move the points and splines to create a straight line on one side.

And there you have it, a nice shadow breaker for you sites all made with XAML!

Another cool thing you can do with these shadows is, create a copy of your shadow, flip it and change it to white, this is called the Gina effect as coined by the guys at “from the couch”.

Thanks for reading, hope it helped and let me know how you go with it!

Alex

I just want to throw together a really quick post on how to create complex shapes in expression design.

There are heaps of sweet tools at your disposal to create the look you want and here’s how to use them.

Here is 2 simple shapes I am going to use for the examples, with a blue gradient, corner radius of 20px and a stroke thickness of 5px

Compound Paths

Compound paths take the existing paths and find the overlapping sections and remove them (the paths are un-altered but the shape is merged).

How to: Select both shapes and goto Object > Compound Path (or just hit ctrl+8)

Clipping Paths

Clipping paths remove anything that is outside the selected “clipping path”.

I have turned the top shape into a clipping path, so it deletes any part of the bottom shape that is outside its path, when you create a clipping path you are given the option on which path you wish to use as the clipping path.

How to: Select both shapes and goto Objects > Clipping path  and select if you want to top or bottom shape to be the clipping path, you can also release a clipping path from here.

Intersect

Intersect is very cool, all it does is find the overlapping sections of the 2 objects and keeps it, then deletes the rest

How to: select the 2 objects, goto Objects > Path Operations > Intersect

Divide

This takes each section of the paths and “divides” them into parts.

This is cool is you wanted to explode the object.

How to: Select the 2 objects, Object > Path Operations > Divide (to detach each section just select each part and move as if they were separate objects)

Unite

Unite simply makes the 2 objects one. Removing any overlapping sections

How to: Select the 2 objects, Object > Path Operations > Unite

There are 2 other options in the Path Operations menu which are:

Front minus back and Back minus front

These items simply remove one object from the other.

How to: Select the 2 objects, Object > Path Operations > Front Minus Back (or Back Minus Front)

And last but not least… the Envelope distort tool…

This doesn’t need 2 objects to be done, but it will work with multiple objects selected…

This will create a grid over your object, and using the Direct Select tool you can manipulate each point in the grid for some really cool effects!

How to: Select you object/s and goto Object > Envelope Distort, then use the direct selection tool to manipulate each point.

Hopefully with these tricks you will be able to get the most out of Expression Design and create some really interesting stuff.

Made using compound paths and clipping paths

Thanks

Alex

On Saturday I have the privilege/pleasure to attend the Silverlight Designer and Developer Networks – Silverlight in a Day Course, and let me just say, WOW! It was just awesome, the guys from SDDN and Microsoft teamed up to produce an awesome day of learning and free swag!

This was the first of hopefully many training days dedicated to Silverlight, and 200+ people applied for a spot, sadly though, there was only room for 40 people, which were drawn out of a hat.

So we all arrived at Cliftons for a 9.30 start and the day kicked off with an introduction from Jordan Knight, Giving a basic overview of the day ahead and any house keeping items that needed to be addressed.

First lab of the day:  Introduction to XAML and Expression Blend with Mahesh Krishnan
Because the day was targeted at beginners of Silverlight, Mahesh gave a fantastic look into XAML, what it is, what it does and why its just awesome. He continued on with a lab on Expression Blend and how to use it to create projects and animations and all sorts of good stuff.

Mahesh Krishnan

Networking, data binding and media - Phil Beadle
This lab was focused at basic networking to WCF (Windows Communication Foundation) services, binding data to objects and media so we got to jump into visual studios (which isn’t my thing at all) and learn some basics which was really easy to pick up! The Media section of this was awesome too, Silverlight is just so powerful when it comes to media, its just not funny!

Phil Beadle

After that it was Jordan’s turn again to look into:

Templating, the VSM, more data binding and the HTML DOM Bridge

Which was a great hands on how to skin buttons using Control Templates and the Visual State Manager (VSM).  This was really my sort of thing, and although there was probably one 2 other designers there, I think a lot of people benefited from learning this stuff.  The next section was a more advanced lab looking at OneTime, OneWay and TwoWay data binding. (we had already skimmed over this earlier in the day as well). and then to finish off the day we rushed through the HTML DOM bridge and how you can call and edit HTML from Silverlight and JS and vice versa.

Jordan Knight

All in all it was a huge day of learning and I’m sure everyone who attended learn heaps of great things to get their silverlight journey started and well on its way.

Oh and the free swag they gave out! So many prizes!!!
Thanks to Microsoft, the SDDN guys had so much stuff to give out, t-shirts, Expression suite and visual studios and even one MSDN TS subscription worth 19k!!!! I pretty sure just about even got something to take home in the end!

And if you attended the day and are reading this, please do leave some feedback on what you thought about it all! The more feedback received, the more chance there is of it being presented in other cities and future events in Melbourne!

Shane Morris(Microsoft), Phillip Beadle, Jordan Knight,

More pics from the day here

Oh and one last thing, If your keen to express your interest in the SDDN for any reason or want to provide some feedback on it, info@sddn.org.au or visit http://www.sddn.org.au

Thanks everyone
Alex

Whole class being quized for free MSDN subs

Manipulating text is really quite simple and you can apply these same rules in Adobe Photoshop or Illustrator and practically anywhere that can create vector graphics.

First step is to get a basic idea of what you want, if you wing it, you might have luck but a lot of the time is just looks like you broke the original font.

So in Expression Design, create a new document and create the text  you want.

Try and get the font as close as possible to what you need, you don’t want to have to re-construct the entire thing.

Original text

I’m going to use ASD because, I’ll be honest, its the first thing I mashed when I hit the keyboard.

Now once you are happy with your text, its time to convert it to a path. Select the object menu up the top and click “convert object to path” or just press CTRL + SHIFT + O

convert object to path

Now once its a path, its just a normal vector, you can’t change the text anymore but you can select different points and manipulate them how ever you like.

Using your “direct select” tool  you can grab each point and edit the shapes how you wish.

Other cool tools you might use are:

• Add Anchor Point
• Convert Anchor Point
• Delete Anchor Point

All these tools are found under the pen tool fly-out.

Some other tips:

• Holding shift allows you to grab multiple points
• If you move them then press shift, you will be constrained to 45 degree increments when moving (great for keeping your lines straight).

You could use these techniques to create a rad logo or by adding this text over the top of some more vectors like in my other vector tutorial can make some other seriously cool stuff…

Thanks

Alex

Over the past few weeks I have been on a little bit of a push with my design freelancing, trying to get my name out there a little more and spread the word about what I do and how I do it.

The way I went about it is looking at what I have already that I can simply improve on, and then I did heaps of research around this. It has improved my traffic massively, I have a lot more followers on twitter now and my site hits are up 10 fold. With that kind of exposure you can imagine what its doing for business around here.

First up!

MY SITE (http://www.agkdesign.net)

I guess the best place to start is with my website. It’s already there and just needed a little more direction and entry pages.

Your website should be the formal place for people to come check out your work, drop you a line/email and generally get a good idea of what you do and how you do it!

The first thing I did to my site was whip up a Silverlight page (http://www.agkdesign.net/silverlight), specific to any work I do with Silverlight, making sure to throw in plenty of keywords that I imagine people would be googling. This includes all the text, meta data keywords and alt text on the page. I did the same for my home page (http://www.agkdesign.net). E.G. the big image at the top with the overlaid text, even though the text is actually an image (therefore not readable by google or other search engines) I have put some mad alt text behind it which pretty much says the same thing as the picture if not a little more.

I will admit though, I have been a little slack on my site but any spare time I have is spent fixing this stuff up, and looking for ways to improve it.

My Blog (Your are here)

My blog is a great way to generate traffic and probably the strongest point of contact for everything I do. I started this blog about a year ago, just posting little bits and pieces of things I learn and create, and over time I started to refine my post styles and work out what people want to read. Again, it’s still only young and will continue to be refined throughout it’s life.

Tips to help your blogging

• So First, If you don’t have a blog, GET ONE!!! it’s free! What have you got to lose?
• Have some content on there to start off (maybe 2 or 3 posts at launch)
• Post regularly (every 2 weeks or more if possible), I know it might be hard to find time, but it will pay off…
  
• Make your posts count, don’t rush them out, look back over them when your done, add links to them, make the content strong and meaningful. Spend time to delete all the rubbish that isn’t needed.
  
• Lists are always a winner when writing a blog. People love dot points and hate slabs of text.
• Post links to other peoples blogs in your posts, they will be notified of this and in turn check out what you said about them.
  
• Keep it social. You blog should be a social thing, write about your experience, don’t just advertise your company directly, show them something cool and how you used it on your lastest and greatest project.
• Get involved. In the blog community I mean. Read other peoples blogs that are in the same profession as you, and then comment them with a link to your page. Most of the time they will check you out.

Just keep in mind a good blog is a massive point of contact and will generate lots of sales and traffic.

Check out this great vid from the guys @ “from the couch” on how blogging will change your bussiness here. (also hit them up on twitter @obox, they post some great stuff)

My Twitter (http://www.twitter.com/agkdesign)

A lot of people still don’t really know what Twitter is and it’s sometimes pretty hard to explain exactly how useful it is. Basically, its blogging with a limit of 140 characters. Quick, simple, and useful.

Imagine this, you have 50 people following your tweets, you say “Hey check out my latest blog on Silverlight + Link”, that’s 50 hits. Good start, but then those 50 people send it onto their friends, called re-tweeting (RT).  Its pretty much an exponential marketing strategy, if your content is good.

Tips to get into Twitter.

• Start an account – its free as well (so no excuses!) Go there now! (http://www.twitter.com)
  
• I would suggest getting a Twitter client so you can post, and follow posts from your desktop while you are busy doing other things. Check out TweetDeck or Twhirl
• Find some people to follow that you are interested in, most people link their Twitter from their blogs or websites.
• Another good way to find people to follow is by lists people compile. 50+ Designers to Follow on Twitter is a great one, or just google to “designers follow on twitter” or what ever your into.

Alright so now you have a good list of people to follow.

Now all you need is people to follow you

• Post about what your doing, people follow the stream and pick up on keywords. “I’m working on some new Silverlight stuff”, people see Silverlight and are interested so they follow you
• Get involved with all the people you are following, by simply adding @theirname, they will see the message even if they aren’t following you. Just don’t spam them, they will just get angry.
• Spread the word! Re-Tweet other peoples posts/links that you found interesting. People you re-tweet can see this and are usually pretty happy about the fact you liked their stuff and re-posted it for them. All you need to do is copy their post and put RT @theirname at the front. You client will most likley have a button for this too.
• When you post a new blog, tweet about it a few times, don’t just spam it out though, leave a fair few hours in between and change your tweets, “hey I just blogged about Silverlight + Link” and then “my blog on Silverlight is doing great thanks everyone + link”.
• Remember your followers are from all over the world, so time zones matter. Do some research to hit the key markets/countries.

Ok, so that should be plenty to get you started on your web/social marketing strategy. Just remember to try and be yourself, not a corporate business, people will connect with you better.

And last of all, link them all together, connect your blog to your website/twitter and your website to the blog/twitter as well, and use your twitter to constantly promote everything, just don’t spam! that’s not cool.

I hope this has helped a bit, and would love to hear about how you have increased your traffic in someway.

I would also like to thank all the bloggers out there who have helped me learn all this great stuff!!!

Thanks!

Alex