A Beautiful Website

need silverlight 1.1

[in the process of updating this for Silverlight 2.0 beta]  

The goal of this project is to create a cool set of controls that when mixed together results in a “Beautiful Website”

I frequently traverse the websphere and sometimes i find a gem of a website, Apple’s website is one of these gems. I will spend the next couple of weeks recreating some of the Apple website controls in SilverLight and Blend.

Here’s a quick picture of all the current controls that I’ve created (click on image to see the demo page in action)

 combined page 6

[PLEASE NOTE: that all controls are found in the same "source code" zip file. If you download it for one control then you will automatically get all controls source code. I added the "source code" link to each control section to make it easier to access over having one link at the bottom of the page.]

“Apples Top Menu” – (source code) (blog post) (sample)

apples top menu as a silverlight control

“Apples Product Slider” – (source code) (blog post) (sample)

productslider.gif

“Apples Marquee” – (source code) (blog post) (demo)

rotating marquee 2

“Apples Slideshow” – (source code) (blog post) (demo)

slideshow thumb

“Apples Accordion” – (source code) (blog post) (demo)

accordion thumb

“Apples Video Player” – (source code) (blog post) (demo)

video player 5 

“iPod Touch – icon line-up” – (source code)  (blog post) (demo)

icon lineup 400px

“Flickr’s Picture Upload Tool” – (source code)  (blog post) (demo)

 Flickr's multi file upload tool as a silverlight control

“Colour the World” – a colour picker done with SilverLight (source code)  (blog post) (demonstration)

“Gold & Sparkly Title + Rotating Marquee” (source code) (blog post) (demonstration)

Please note that these controls are not production ready controls, they are here to give you inspiration to create your own controls. However, saying that, most of these controls need only a little work to get integrated into a real production web site, ultimately in time they will be refactored to form a cleaner control library. Please remember that I too am learning SilverLight and Blend, these controls are a result of that learning process :)

31 responses to “A Beautiful Website

  1. hello,
    seems all very nice but the problem is that I get the following error with all your demos, IE7…

    —————————
    Windows Internet Explorer
    —————————

    Silverlight error message
    ErrorCode: 2251
    ErrorType: ParserError
    Message: AG_E_RUNTIME_MANAGED_ACTIVATION
    XamlFile: xAML_BlendCandy/Accordion.xaml
    Line: 6
    Position: 54

    —————————
    OK
    —————————

  2. are you using silverlight 1.1 alpha refresh? I think my createsilverlight javascript calls only show 0.95 as the required version but i believe i need to change that. I’m going to fix it tonight and update the blog page to let people know that they need silverlight 1.1. Refresh.

  3. Hey, I know I’ve left a comment before, I didn’t have the newest version of silverlight to view your work.

    Now, that I do have it and can see how amazing your stuff is. Is there anyway I can use your code into my own website? I mainly want to use the accordion feature, it’s hard to find a code of it to look like Apple’s and hard to copy Apple’s and all it’s files to your server to get it to work correctly.

    I would e-mail you this, but I don’t know your e-mail. I hope you can help me, or at least point me into the correct direction that I seek.

  4. the code to all my samples is in the “a beautiful website” page. Feel free to download it and use it anyway you want.

    Get your developer (or yourself) to rip apart sample and use the accordion if that’s what you want.

    Alot of the controls i’ve created took me less than an hour to make, and the code reflects that. You should probably refactor it before you go live with it but its up to you.

    Let me know if you have other ideas for controls you would like to be built.

  5. You are kicking some ass here dude, keep up the good work as I’m enjoying it!

    -
    Scott Barnes
    RIA Evangelist
    Microsoft.

  6. Absoluletly Fantastic! You are an inspiration!

    M

  7. I use Firefox 2.0
    Your demo requires installation of something called “Silverlight”. What is that?

  8. Led Zeppelin Silverlight is Microsoft’s version of flash. I use it to build my application with, it’s completely safe (if you trust stuff from Microsoft that is). And the blue graphic at the top of the page direct’s you to the download page where you can get it from.

    Honestly If your willing to install I would wait till March when it moves out of alpha and into Beeta (a more stable and distributable version)

  9. Great job!

    I download your source, but still have problem to run it. For example, how to create Accodion control using Accodion.dll?

    thanks

  10. I’m using VS2008 and trying to add the Product Slider to my Silverlight application.

    I can’t find the Categories.xaml.cs in the code I downloaded. How do I get the scrollbar to work?

  11. Jose you’re a Silverlight Guru.

  12. Sharker Khaleed Mahmud

    Hi,

    This examples are great. I lately visited templatemonster.com and saw lots of flash website. Its not the flash part that caught my eye but the background combination of colour effects that they used to show a site. I was wandering if u could do some demo of some great background composition using color and effects in blend.

    If u do, please give a nudge at my email address

    Sharker Khaleed Mahmud (MCPD)

  13. Pingback: “Colour the World” - my version of an iPod Touch Colour Picker done with SilverLight « Online Advertising, Web Development & General Rantings

  14. hi, interesting information you got on web sites, but can you make money or on this technology? i’m not tolking rich but supplemental income. Which is better HTML or PHP or Flash? What i mean is easier to build/create? thanks, good post by the way i think links are the most important part in promotion

  15. Thanks for the post, I like to find inspiring ideas and practical knowledge to help bolster my own awareness for web design and development in general. Blogs like yours are a great source of inspiration for me and I will keep an eye open (on your rss feed) for more of your brilliant posts. Cheers!

  16. Pingback: Don’t worry Silverlight , you’ll always have me :) | Silverlight and other cool things …

  17. Pingback: Towel Warmer Reviews

  18. I’ve recently started a blog, the information you offer on this website has helped me greatly. Thanks for all of your time & work. “Quit worrying about your health. It’ll go away.” by Robert Orben.

  19. Large fx exactly like the ruskies, the Oughout.Erinarians. monetary, The english language single pound, Canadian usd … are really might be able to hovering currencies. Any so-called spectacular forex similar to the Chinese yuan, are actually coding and programming examples values at permanently fixed percentage rates.

  20. Pingback: binary option

  21. Love the examples you gave- just curious when will you have the update for the silverlight 2.0 beta?

  22. Hello, Neat post. There is an issue along with your site in web explorer, may test this?
    IE still is the market leader and a huge element of folks will leave out your fantastic writing because of this problem.

    http://www.valuesite.org/process.php?domain=monikabus.

    pl

  23. Problem is that many medical professionals will tell you that you need to have surgery or use their medications to manage your hemorrhoids.

  24. I hardly leave a response, however after looking at through some of the comments
    on this page A Beautiful Website | Silverlight and other cool things ….
    I do have 2 questions for you if you do not mind. Could it be only me
    or do some of these responses come across like they are written by brain
    dead individuals? :-P And, if you are posting at other sites, I’d like to follow everything new you have to post.
    Would you make a list of the complete urls of all your social pages like your Facebook page,
    twitter feed, or linkedin profile?

  25. Just about all of what you mention is supprisingly legitimate and that makes me ponder the reason why I hadn’t looked over this in this light previously. This particular article really did switch light on for me as far as this particular subject goes. But at this time there is just one point I’m not really too cozy with and whilst I try to reconcile that with the actual core theme of your position, allow me observe exactly what the most of the readers need to say.Very well done.

  26. Thanks for sharing.. keep succesfully…

  27. Heya i’m for the first time here. I came across this board and
    I find It really useful & it helped me out a lot.
    I hope to give something back and help others like
    you aided me.

  28. hey there and thank you for your information – I’ve certainly
    picked up something new from right here. I did however expertise several technical issues
    using this website, since I experienced to reload the site lots of times previous
    to I could get it to load properly. I had been wondering if your hosting is OK?
    Not that I am complaining, but slow loading instances times will sometimes affect your
    placement in google and could damage your high-quality score if ads and marketing with Adwords.
    Anyway I am adding this RSS to my email and could look out for much
    more of your respective fascinating content. Make sure you update this again soon.

  29. What’s up friends, how is everything, and what you wish for
    to say regarding this piece of writing, in my view its actually awesome designed for
    me.

  30. Good write-up, I am regular visitor of one’s web site, maintain up the excellent operate, and It’s going to be a regular visitor for a lengthy time.

  31. I told you all of this rather boring stuff soo you
    could undersstand why there is a membership fee. Seeing all the
    different patterns that can be used to find words is another aspect you ccan learn.
    Mike Tyson’s Punch Out is a classic game
    and memorable for moving up the ranks.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s