Talk on replicating Windows 8 modern UI on web using HTML, JS and CSS

Here’s my talk on my Open Source project Droptiles, which replicates the Windows 8 Start UI on the web using HTML 4, JS, CSS 2. I have given an walkthrough on how to use Twitter Bootstrap to create modern looking UI. Then how to use KnockoutJS to build a web applicatoin following the Model-View-ViewModel pattern. And some handy use of UnderscoreJS. After the introduction of these frameworks, you will see a quick demo to build a sample dynamic modern UI page that mimics the Windows 8 Start screen look and feel – implementing Bootstrap, KnockoutJS, jQuery together. Then I have shown how to build a new Tile in Droptiles.

image

http://skillsmatter.com/podcast/home/droptiles-windows-8-modern-ui-on-the-web-using-plain-html-css-and-javascript

4 Comments

  1. Assalamo Alaikum…

    nice work Omar…
    i want to learn how to add a tile on the Dashboard…
    I have go through all the steps that were mentioned on Code Project article…Build the ComnineJS.bat and updated the ?v=14 but i am un able to load a single tile?

    Can you further help me out?

  2. Hi Omar,

    I’ve Create tile with dynamic page using repeater, i have questin how to use slide image on tile and how to use an opening page on main content because when i used a href, it open to other page and how to open page on tile on dynamic page tile. this is my code :



    <asp:repeater id="childRepeater" datasource='’ runat=”server”>

    <div class = '’>
    <div class ='’>
    <a href='?subID=’ />
    <img src= />
    <%– –%>

    <%–<a href='?subID=’ /> –%>

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>