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.


4 thoughts on “Talk on replicating Windows 8 modern UI on web using HTML, JS and CSS”

  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