World? ERModernLook. ERModernLook? World.

ERModernLook is a modernized DirectToWeb look added to Project Wonder this morning. My sneak peek post from yesterday has a short screencast that gives you an idea of what it looks like.

Some additional details:

ERModernLook Frameworks

  • ERModernLook – contains the standard look page templates
  • ERModernDefaultSkin – contains the css and style resources
  • ERModernDirectToWeb – contains modernized versions of components from ERDirectToWeb

ERModernLook Applications

  • ERModernMoviesDemo – a demo application based on the ERMoviesLogic framework


ERModernLook was designed with the following features in mind:

  • Tableless semantic markup – tables are used but only for tabular data (i.e: list pages).
  • Uses the Ajax framwork to supply pragmatic ajax behaviour.
    • When paginating
    • When switching inner page tabs.
    • In-line editing of related objects.
  • CSS inspired by: “Object-oriented CSS”
  • CSS and style resource are located in a separate skin framework making customizing easier.
  • All buttons/background images are references via CSS and are contained in the skin framework.
  • Enhanced edit relationship page that is embeddable and supports in-line related object editing and creation.
  • Enhanced edit date component based on Unobtrusive Date-Picker Widget V5.
  • Professionally designed default skin.

Getting Started

The easiest way to get started is to watch the demo videos (OK, not just right yet, but there will be demo videos) and then run and play with the ERModernMoviesDemo application. ERModernMoviesDemo uses the ERMoviesLogic framework which has an embedded H2 database and shouldn’t
require any configuration to get running.

The ERModernMoviesDemo can easily be copied and modified to use any business logic framework.

  • Modify the NavigationMenu.plist to customize the main menu.
  • Duplicate and modify the MoviesNavigationController referenced by the session to support your Entities.
  • Modify the user.d2wmodel to support you Entities.

Using your own skin

The CSS resource components in the look pages obtain the name of the framework that contains the css files from the
er.modern.look.skinframework property. This makes creating your own skin as easy as duplicate the ERModernDefaultSkin framework
and change the value of that property in it’s Properties file to match it’s new name.

Known issues

  • The look has seen VERY little testing on IE. Feel free to file bugs, but since I avoid IE at all costs, only bugs with patches will get serious consideration (and probably not at all for IE prior to 7).
  • The look is pretty young, so expect to there to be bugs. We will be using it in production apps so expect any obvious ones to be squashed pretty quickly.

That said, enjoy!

9 thoughts on “ERModernLook

    1. Philippe,

      Philosophically they are quite different I think.

      – The page structure makes more sense to me (as I hope it would ๐Ÿ™‚
      – The CSS markup is inspired by “Object Oriented CSS” which makes styling cleaner
      – It uses the Ajax framework which I was very familiar with so it makes extending the framework easier
      – The edit relationship page is embeddable
      – The look contains no style resources, they are in a separate skin framework
      – It comes with a nice style out of the box

      Ultimately, I set out to create a modern look that made sense to me. I think I’ve achieved that. I encourage you to check the inner workings of ERModernLook and DivaLook chose the one that speaks to you.

  1. So, are you going to talk about the new look in your WOWODC sessions? ๐Ÿ™‚ Ravi will talk about his DivaLook so it would be cool to hear about the two moderns D2W looks at WOWODC.

  2. Is there anywhere which tells us D2W newbies how to use D2W inside an app originally not built for D2W? It appears that you can (the various google searches contain messages clearly implying this) but I’m not finding a wiki or confluence page describing what is necessary.

  3. Hi Andrew,

    There is a section in Apple’s D2W developers guide that talks about embedding D2W components in a non D2W application.

    Wonder adds ERD2W flavours of the D2WQuery, D2WList, D2WInspect pages that it talks about.

    My ERExcelLook screencast talks about the steps required to add D2W to an existing application as well.


Comments are closed.