Well I’m happy to say I’ve, sort of, found the person I want to help me sell NML and our skills. I say sort of because a) this person can’t be constrained to a rigid job, so we have a relatively informal yet mutually beneficial arrangement and b) because he isn’t really a sales person. He is a connector, a deal maker, a bit of hustler (in the nicest possible way) and a full time urban ninja. Yes, Raoul De Jongh, Mr urban-ninja.co.za and NML are going to be working together. Having realised that we share a mutual work hard/play hard ethic we’ve been talking about combining NML’s platforms and platform building abilities with Raoul’s sales and marketing abilities for a while – now it is a reality.

Definitely such an exciting time for all of us digital people.   #BOOM

Recently NML’s shareholding changed and I am now the only shareholder, this has freed me up to make other exciting decisions which I will be announcing in due course.

Surviving two and a half years of tech start-up during these very difficult times defies the odds, building up an amazing team, powerful Intellectual Property and having a healthy pipeline is an amazing achievement and something I am proud of.

2008

NML was started in January of 2008 with an abundance of ideas and energy.  The sub-prime credit crisis was something that we thought would only affect the USA and we certainly didn’t conceive the pending global recession.

Usually it is intelligent dynamic people who are keen to take a risk.  So it wasn’t surprising that Richard Schroder and Debbie Derman were the first employees to join NML in April 2008 – both truly brilliant, they are hired knowing that in two months time they will be leaving on a three-month trip through Africa.  Their skills and the hope of them being long-term NML employees can’t be ignored.  The risk paid off.

NML commences work on Windows CE/Mobile GPS triggered tourist information software for Smartguide.co.za.

NML develops a custom niche social network in ASP.Net for Brandhouse.  Similar in complexity to Facebook (no jokes), the system allows for media uploads (video/photo), community, notifications, tagging, events, rating, commenting, FAQs and polls.  The system is fully integrated into the metrics and segmentation engine Eureka.  Eureka is Global Vision’s marketing automation engine used by Diageo.

Rogan Flitton, Gareth Saul, Yves Bamani and Gugulethu Ntombela join NML as permanent employees.  Cara Knight Dawson joins as my PA.

Mark Derman (founder of Safarinow.com) and Ernst Kuscke (Microsoft MVP) join NML as long-term contractors.

NML develops a financial services platform for a leading bank.  We develop the service layer, database and front end in Silverlight together with Global Vision.  Stonewall+ provides the front end designs.   The application is integrated into the banking backend and adds social software elements to their traditional business.

NML developers work on the Silverlight front end, middle tier and database for Global Vision’s next generation marketing automation engine, Adora. Read about the development process here – Adora Development Process

NML starts a junior developers program.  We give part-time work to students who are mentored and paid to develop applications for NML.

The NML juniors develop a Facebook competition portal that we re-skin and re-utilise as a framework for digital art, photographic or copywriting competitions – we reskin this for our clients and rent the framework.  A Facebook application called “My African Bucketlist” and a number of other web and mobile applications are also developed.

NML develops a giving portal TheTrust.org.za at cost as part of our corporate social responsibility initiative.  We aggregate charities into charity sectors and allow for payments using credit card, MiMoney, Ukash and EFT.  We also generate certificates of giving and a recurring monthly payment system.  TheTrust is sponsored by Pick n Pay, IBurst and Vodacom.

NML also develops a variety of micro-sites and applications during the course of 2008.

NML did not lose a single client in 2008.

2009

Christian Bamani and Ashraf Vanker are hired out of the juniors program – the juniors programme pays payback.

Finance Honours graduate Elsie Verheye joined New Media Labs as Operations Manager.  In addition to managing the finance, accounts and assisting with audits, Elsie’s expertise also extends to being NML’s qualified SCRUM Master.  Her exceptional organizational skill puts her in the forefront of what’s going on at New Media Labs.

NML releases the first iteration of the Google Earth, Flickr, YouTube and Smartguide content portal. Read about the development process here – Smartguide Development Process and view the application here – African Tourism Portal.

NML develop a Silverlight CMS for Smartguide.  Smartguide is integrated into our first client’s tourism portal – Southern Destinations. NML invests in Smartguide and becomes a 20% shareholder.

Andrei Dimitriu joins NML as an intermediate developer.

NML develops the CMS to illustrate Nedgroup Investments’ business model of fund management. Read about the development process here – Nedgroup Investments Development.

NML modularises and productises the CMS developed for Nedgroup Investements.

NML, together with Aurecon, develops the web-based incident management software.  All CCTV footage is monitored and the Silverlight web application is used to log incidents.  This product is nominated for an innovation award by Microsoft (Redmond).  Read about the development process here – Aurecon Dev Process.

Videos of the applicaiton can be viewed at http://www.youtube.com/newmedialabs.

NML develops a mapping application for the Peace Parks Foundation using ESRI mapping and Silverlight.

Andrei Dimitriu develops the backend for GloMobile utilising NML’s base CMS.  Stonewall+ provides the front end designs, Global Vision provide PM, development and testing skills.

NML and Ilan Copelyn develop a bursary management system for the HCI Foundation.  The system engine ensures the accurate apportionment of funds across institutions (universities, technikons and FETs) and courses (medicine, law, engineering etc.) to the people who are deemed most needy and most deserving of a bursary.  This is calculated according to parents’ salaries, grades at school or in the previous year and number of applications per course per institution.  More than two thousand applications are managed through the system.

NML releases the WordPress site for the Vrede Foundation – a foundation in tribute to a friend of mine from way back when.  A charismatic legend.

NML starts developing in partnership with Heath Wallace, a leading user experience agency based in the UK.  Their services include research, information architecture, design and development.  Together with Heath Wallace, NML develops aspects of the websites for one of the top 5 banks in the world.  A second and third project in partnership with Heath Wallace starts shortly thereafter.  A good sign for our proposed long-term partnership.

At the end of 2009 each client has returned for at least a second or third phase of development.

2010

Most of our projects are still in development for this year and thus can’t be discussed yet.

Watch out for the launch of NML’s background project WeLove.co.za . We have utilise our service-oriented architecture framework to develop a front end that is re-usable across a number of niche social networks.  Multiple applications run off a single database, thus each service call is made with a unique application ID.  WeLove.co.za will be used to launch a number of our own social network applications all based on groups that share a common interest or passion.  Expect to see niche sites hosting WeLove communities such as WeLove coffee, WeLove our children, WeLove Healthy Bodies, WeLove Running etc.  You name it, where there is passion there could be a WeLove community!  The amazing thing about this project is the collective energy shared for it by all of the NML team.  We believe in this product and how it can facilitate relevant and engaging communal conversations around each of our own interests.

We have delivered a virtual itinerary for Smartguide. The software is integrated into the traditional itinerary building software used by a number of tourism operators. The virtual itinerary gives the client a map based view of their holiday and a day by day breakdown with routing drawn on the map. Over 100 tour operator commence integration of the virtual itinerary into their traditional systems.

NML assists Heath Wallace with the development of software for two of the top five global banks.

NML continues development with Aurecon on a number of projects that can’t be discussed.

NML continues to develop software in partnership with a number of the top digital agencies in South Africa.

Raoul De Jongh, the urban-ninja has joined us as a sales person. Read more about his joining NML here – Collaboration between NML and Urban Ninja, Raoul De Jongh

To receive future NML news please subscribe here - http://www.newmedialabs.co.za/contact-us

Please follow NML on Twitter - http://twitter.com/newmedialabs

Please become a fan of NML on Facebook – http://www.facebook.com/newmedialabs

Thank you for taking the time to read this post. These are exciting times, we would love you to be with us for the journey.

I was really happy when I was received with open arms by the people of Peace Parks – they made me feel like I belonged with their friendly and welcoming ambience and working in peaceful environment made my work that much easier.  The work that they do is inspirational and I support them all the way.

The Problems:

1.       Peace Parks Foundation wanted a SharePoint site that would assist them with their document management, since they are always travelling and have many departments.

2.       The SharePoint site had to have the exact style as their actual website to facilitate the users’ comprehension and usage.

3.       The site had to be fully searchable.

4.       When a new page or site is created within the SharePoint site, the theme had to be the same across all pages.

5.       Some pages had to add the voyager GIS that they always use for their work.

6.       Each department had to be able to add staff pictures of their respective department.

The Solutions:

1.       A strong knowledge of SharePoint, C# and Aspx was required.

2.       I modified a pre-existing site, which with all due respect required a lot of alterations – firstly, I had to modify the template which required changing the many style sheets and making one big one to which all the pages connect to, thereby ensuring style unity across all the pages.  Secondly, I had to modify all the images to suit the style – I used Adobe Photoshop.  The standardisation of the pages allowed for greater speed as all images are now optimised for web and only one CSS is accessed.

3.       The search engine was one of the most challenging sections to create.  The biggest problem was that the installation of MOSS 2007 was not implemented properly and therefore quite a few functions were not working as they should have been.  A few modifications to the installations and to the registry files fixed that.  Thereafter, I had to create content sources that crawled (indexed) the whole site.  And then it was just a matter of creating scopes for the search and ensuring that the search centre connected to those scopes.

4.       *View point 2*

5.       Adding the voyager GIS was one of the easiest requirements to implement.  All it required was the addition of a page viewer web part and the voyager GIS link!

6.       To allow for the ability to add departmental staff photos, I created a content editor web part and inside that web part I added a few html and J-query codes that showed the staff photos and allowed emailing the staff in question just by clicking on a button right below the picture.

As Global Vision made the decision to develop the Adora front-end using Microsoft Silverlight (at the time a very brave move – Silverlight 1.1 was VERY limited compared to Silverlight 3!), New Media Labs was asked to provide some assistance in the development process.  With full-time in-house User Experience (UX) designers and interface designers from Stonewall+, this project has really brought to light the power and flexibility of the Silverlight platform.

Design of Adora

The application is built along a classic Model-View-ViewModel (M-V-VM) architecture and utilises a custom-built framework for this that supports all the required elements.  We had a number of technical challenges to overcome along the way, mainly related to data storage and using the same Domain model on both the Client- and Server-side.  Most of these issues are posts in their own right and will be covered in the near future.

Adora consists of many layers, each with its own set of technologies.  Starting from the client and working our way to the backend:

• Client
  Silverlight 3, utilising the Silverlight Toolkit and numerous custom-built controls.
• Services
  The application services are provided by WCF services that are hosted on the server.  These are communicated with using a custom-built data-contract serialiser.
• Data storage
  Data storage is provided by SQL Server 2008 and data goes through many stages of filtering and matching to ensure maximum data integrity.
• Messaging
  A messaging and scheduling engine resides on the server side to handle all email and SMS communications with consumers.  Messages received are linked to the consumer’s profile.

The Development Process

The goal is to deliver a product that is not only scalable, flexible and fast but is also pleasant to use with minimal or no user training.  With a team consisting of UX designers, developers, graphic designers and QA testers, we are continuously and iteratively tweaking the design.  Using an Agile approach has allowed us to make fast-paced design changes whilst ensuring that the end result not only looks good, feels good and performs well but also matches the expectations of the Product Owner.

We currently employ a mix of various established practices – test driven development, peer reviews, daily stand-ups and whiteboard sessions are some of the things that we do every day.

Interface Design

Adora’s interface borrows heavily from concepts used by Windows Explorer to allow users to work in a familiar environment.  For example, “folders” represent brands and “files” represent elements such as email lists, creatives or even communication schedules. 

Adora Explorer interface

Wireframe designs are created by our UX designers and the initial development work to implement functionality is done by the developers and testers.  Whilst this is taking place, the interface design is UAT-tested by the UX designers – the interface is then sent to Stonewall+ for “polishing” and styling.  Due to Silverlight’s dynamic binding model, it is simple for the developers to drop the finished interface on top of the functional elements built.

All work with consumer populations is graphical – that is, instead of reams of confusing numbers that may not appear to have any significant proportions or relationships, Adora presents interactive graphs.  A user with little or no SQL knowledge is able to build up complex queries very quickly with this system and it provides a “quick-glance” overview of the consumers that the user is currently communicating with. 

Marketing List builder interface design

Adora Query Language

Central to Adora’s success is our own query language that we have developed: Adora Query Language, or AQL.  With a syntax that is similar to SQL, AQL allows developers to retrieve consumer related information using queries that are business oriented.  If that doesn’t excite you, how about this:

SELECT firstname, lastname, age FROM brandname WHERE gender=’male’ AND age>25

The result of this query is a list of consumers within the “brandhouse” brand that are male and over 25 years of age.  A complete subset of SQL is supported, including ORDER BY, GROUP BY, INTERSECT, UNION and many more.  On top of this, we have our own extensions to the language that allow us to apply pagination to data results or to even group data into ranges.  The result?  Our developers can focus on working with data, not on retrieving data.  It is envisioned that future versions of Adora will allow 3^rd party vendors to create add-ins to the Adora system using AQL.

What’s next?

Still to come – details on the technical challenges faced and more screenshots!  Beta 1 is scheduled for release in January 2010. 

Realisation 1 – facebook API didn’t expose the wallpost (obviously this was what got people coming back to facebook)

I’m determined and so we (Willem Odendaal and I) resorted to an old favourite technique of mine – Screen scraping or Indexing as google call it. Basically we made what is called “A Bot”.

Realisation 2 – you can only see the wall if you’re someone’s friend. No worries the Bot would be a Facebook user – enter Peter Lear (who Leared at your wall).

Peter (The Bot) had to login to facebook, check all his friends walls and screen scrape the html, check if there was a new post (the old highest value post was already loaded in the Database) pick up the new post and then bang it out to the “friend” as an SMS. The idea was that this would be about as prolific as Please Call Me’s – adverts [possibly contextual] would be attached and I would make lots of money. Boom.

Easier said than done. Attached is some of the code. The app worked a treat and within a week Peter had lots of friends - problem.

Realisation 3 – this could cost me a lot of money in SMSes (sent from a clickatell account) as some “friends” were getting 10 posts a day…

And so I tried to find an agency that would like to use it. But advertising doesn’t work like that. It is much slower and less dynamic than you may realise. Advertisers are often scared to try something new. If it isn’t in the strategy that was set x months ago - they won’t touch it was the message I got back. And so it wasted me money for a couple of months and I took it offline… only to see Vodacom integrated the wall into facebook 18 months later. Hmmm maybe I just didn’t sell it well enough or maybe it just wasn’t such a great idea.

Of course Peter Lear is still on facebook, he only has 17 friends, he plays Farmville now (Frances – my daughter – begged me) and when facebook is feeling kind they recommend that I make facebook better for him. Please write on his wall – http://www.facebook.com/profile.php?id=534167080

Attached is some of the code from Peter “The Bot” Lear. The login, the scrap, the send…

Interesting aside though – it was one of the things I showed Jon Jacobson that made him believe that he should invest in my company “New Media Labs” and that my ideas would slot into their marketing automation engine – Adora. And so it goes… everything for a reason – just do it.

 ps. Warning. The hot girl that’s following you on twitter and spamming naked pictures of herself at you – this is what she looks like! She also beats you at poker, chess, etc. She’s also tried to login to this wordpress site and take control if it over a thousand times. … just a thought.

pps. This is what geeks do for fun.

Get a list of his friends...

Login..push.

Scrape...aka Index

SMS Send

Aurecon is developing a whole suite of new Incident Management/Emergency Response Software for clients in areas such as Emergency Services, Disaster Management and Policing.

The Problem

New Media Labs came on board specifically to design, develop and implement a system that:

• can capture all the necessary information needed by an emergency response unit in order to respond to an incident more quickly and efficiently.
• has an easy to understand and operatable Graphical User Interface.  The more “Minority Report” it looked the better, and as the client once put it, “if we had to put Homer Simpson in front of it, he’d know how to operate it.“
• is GIS enabled, so that operators can pinpoint locations easily and relay co-ordinates to responding units.
• is easily deployed across various control stations across the country, and ultimately the world.

It just so happened that one of Aurecon’s existing clients operates a large CCTV control centre in the City of Cape Town and was in the market for such an application.

The Solution

Designed for a call centre/control station environment, our system presents the user with a graphically rich, simple and easy to use User Interface.  Aurecon was adamant that not only should the system work well, but it should also look great, as this would be a large selling point over competing systems.

We implemented a container based UI where functionality is broken up and grouped into several independent, movable, expandable containers/panels.  These panels allow the user to view and work on multiple aspects at once, as well as the ability to drill into one specific section and focus all their attention on that one task.

One of the key aspects to the system is a map - the map gives the user the ability to quickly navigate to a street, intersection, and popular landmark or CCTV camera location.  Designed specifically for a CCTV control station, the system contains a list of hundreds of operational CCTV cameras in and around the City of Cape Town region.  If an operator identifies something on one of their camera monitors, they then pinpoint the location on the map and capture necessary information about the incident so units can be dispatched accordingly.  Ultimately, the information captured in the system is also reported on.  Existing incidents are indicated by a coloured dot on the map depending on the priority of the incident.  CCTV cameras are marked by camera icons.

How did we do it?

In a nut shell, Start Lite, as the system is called, has a 3 tier architecture comprising of:

• a SQL Server 2008 backend
• WCF SOA middle tier
• Silverlight UI

Working closely with a newly established Aurecon Development Team, we were on site full time for the duration of the project.  We introduced their team to the SCRUM methodology and went from initially running all morning stand ups and sprints to SCRUM being fully integrated into the Aurecon staff and their project management processes.  With SCRUM, New Media Labs were able to keep up with the demanding deadlines of the project and finish Start Light on time and successfully.

Database and Web services

At New Media Labs, we believe that applying tried and tested patterns and practices is key when building software.  Not only does this accelerate design and development, but it reduces potential risk by ensuring that you’re applying industry standards that other software developers out there are doing as well.

On this particular project we decided to use 2 Microsoft Patterns and Practices: Repository Factory and Web Service Software Factory Modeling Edition.

The Repository Factory is a guidance package that automates creation of entity classes that map to database tables and repository classes to read and write those entity classes.  With it we were able to quickly build our data access and business logic layers.  The Repository Factory creates Business Entity classes from your database schema, generates CRUD (Create, Read, Update and Delete) stored procedures, and ultimately links the two together into ode that is easy to understand and maintain.

With the Web Services Software Factory Modeling Edition, we were able to sit with the project owner and business analysts and graphically model the web services in full view with the use of a projector.  These sessions added incredible value as the whole team (not only developers) was involved and we could brainstorm and discuss more freely.  Once Modeled, the service contracts, message contracts and data contracts are all generated into code that is easily understandable.

With the Repository Factory and Web Service Software Factory, New Media Labs were able to maintain a high project velocity whilst simultaneously getting the Aurecon Development Team up to speed with the architecture, patterns and practices.  Using the tools is trivial and the resulting code clear and understandable.

User Interface

Why Silverlight?

• Silverlight is a cross-browser, cross-platform and cross-device web technology, perfect for Aurecon’s need for a system that is quickly, easily and cheaply deployed.
• Deployed on an IIS 7 web server - all the client needs to do is download the Silverlight plugin and start using the system.  It’s that simple!
• With Silverlight, we were able to rapidly develop a visually rich user interface and experience.

Yes, ok but why not Adobe Flash?

• Aurecon are already heavily Microsoft with various systems and backend processes already built on Microsoft platforms.  With Silverlight leveraging the .NET framework, we were able to create a system that can wield a rich user experience as well as support and easily integrate with other Microsoft back ends.

As for the Mapping functionality, we used the ESRI ARC GIS API for Silverlight component on top of Aurecon’s very own ESRI Arc GIS Server.  To avoid taking credit where it’s not due, Aurecon own and manage their own GIS data, New Media Labs just got the map to do all the funky things with the data we wanted it to do on screen.

Worth Mentioning

- Login with ASP.NET Authentication Services

• ASP.NET already comes with a huge array of out-the-box Membership, Role and Profile functionality, so why recreate the wheel?  Start Lite leverages this Membership and Role Functionality.  One can simply expose the ASP.NET Authentication system as a WCF web service with a few configuration settings.

- Blacklight

Multiple Panels Open

One Panel Open

• For draggable collapsable panelscontainers we utilized the open source Codeplex Blacklight Control suite and customized some of their controls to suit our needs better.

- ViewBox Control

• We decided to use the ViewBox Control which comes with the Silverlight Toolkit to handle the resizing of our various panel and container contents.  Manually resizing each UI element within a panel’s content when the panel is either maximized or minimized would have been cumbersome to do, and this handy control saved us a lot of time and effort.  It works wonders!

- Announcement and Notifications Engine

Announcement Functionality

• It wouldn’t be New Media Labs style without a social media element to it - we custom built an announcements and notifications engine.  Announcements let a user post important messages for others to see, whilst notifications get fired when important things happen within the system such as the creation of an incident.

- AutoCompleteBox Control

• In Start Lite, we tried to guide the user as much as possible when entering information. The AutoCompleteBox control is another cool control that comes with the Silverlight Toolkit (http://silverlight.codeplex.com/).  For Example, when searching for an address, the AutoCompleteBox keeps presenting the user with options based on what they’ve typed in thus far.

- Embedding PDF in Silverlight

• In Start Lite we implemented some magic to embed a PDF document within the Silverlight.  What’s actually happening though is with java script, we’ve actually placed a div tag on top of our Silverlight object and that div tag contains the PDF viewer control.

What is next?

As they often say, there is no rest for the wicked, and at New Media Labs, building “wicked” software means once we’re finished with one, we’re onto another!

Utilizing elements and components from Start Lite, we helped Aurecon develop a Back Office Incident Logging System, to be utilized by patrol officers and units, who while on patrol and by their own intervention identify or become involved in emergencies and incidents and ultimately resolve the issue then and there.  Upon their return to the station after duty, they can “back” capture such incidents for reference and reporting.

As with all systems, there is always a phase 2 and with Start Lite we’d like to focus more on modularity and being able to plug in or unplug functionality based purely on a particular clients requirement.  Silverlight is always evolving and with the release of Silverlight 3 there are some awesome new technology advancements we’ll be taking into account, specifically:

- MVVM

• In the case of Slverlight, you run the risk of ending up with code behind mixed with XAML in varying degrees and ultimately a solution which is difficult to maintain, refactor and test.  As with any large application, it is always a good idea to structure ones User Interface into its own subset of layers.  MVVM (Model-View-View Model) is a Silverlight specific pattern much like MVC or MVP which separates data (the Model) from the UI (the View), and presents the data in a bindable way for the UI (the View Model).

- RIA

• Microsoft .NET RIA Services simplifies the traditional n-tier application pattern by bringing together the ASP.NET and Silverlight platforms.  RIA Services provides a pattern to write application logic that runs on the mid-tier and controls access to data for queries, changes and custom operations.  In a nutshell, with RIA Services, we wouldn’t need to build a WCF layer.

- PRISM

• Ever heard of a Composite Application Block, well that is what PRISM is, a Composite Application Guidance Block specifically for Silverlight and WPF which allows one to modularize the UI and build it in such a way so that one can easily load or unload modules at choice.  Ideal for large, ever changing and ever growing applications.

We chose to use the ASP.Net MVC 1.0 Framework because it satisfied most of our requirements, both for the CMS and the site.  The look and feel for the website was designed and created by Stonewall+ and this HTML was seamlessly plugged into our MVC view as soon as it was supplied.  We used SQL Server and Linq for the data access.

Navigation

The navigation for the site was driven by a SiteMapProvider with all the nodes being managed in the CMS.  There were certain rules around the nodes i.e. Certain nodes cannot be removed or unpublished; nodes can only be published if their parent is published etc.  The sidebar and breadcrumb navigation on the site is dynamically generated from the SiteMapProvider.

CMS Item Workflow

The following content types:

• Generic Content
• Person
• Fund
• Media

incorporate the following features:

• Publishing workflow
  • Item Creation
  • Item Approval
  • Item Publishing
  • Item Archiving
• Email notifications
• Versioning
• Featured Item

Only certain user roles can perform the different workflow steps, with an over-seeing administrator role which can perform any of the tasks.  Once the item moves to the next status, an email is sent to the relevant parties to inform them and provide a direct link for them to action.

Each item has an Effective From and Effective To date, so you can easily set an item to only appear on the live site from a certain date, or until a certain date.

A versioning system is in place which allows a currently published item to be edited, without affecting the actual live item, until the new version is approved and published, at which stage the “old” version will fall away.

Each of these content types also allows for linking to media items such as newsletter PDFs, promotional video clips, fund fact sheets, etc.  Our link selector tool allows you to create an association to already-uploaded media (done via the Media Manager)

You can also feature an item in the CMS (Fund or Media) and that item will immediately appear on the home page of the website in the featured item boxes.

CMS User Management

Creating a new user

A user can either be an Administrator, or any of the other options or combinations thereof.  More roles can obviously be added depending on the business requirement.

CMS Media Manager

Media Manager

Administrators can upload files via the Media Manager, and these files can then be linked to the content items.The administrator can add and remove folders to allow for easier file storage management.

Website Screenshots

Investment Principles

Executive Committee Listing

Fund Detail

News

Things we learned

After the site went live we discovered an interesting Linq bug.  Turns out the Load Testing slipped through our QA’s net!  We learned very quickly to make sure this doesn’t happen again…

Next time we’ll also make sure we implement the latest and greatest version of the SiteMapProvider for MVC.  The version we used didn’t seem to refresh the nodes properly and so we spent far too much time on it than it deserved!

We recently gave a talk at Sanlam on Silverlight. We recorded the presentation and I got Elle to create an abridged transcript of the talk [she wasn't very happy with me].

Gareth Saul – Why

Rogan Flitton – What

Debbie Derman – How

Gareth ( http://twitter.com/garethsaul )- What is Silverlight? 1/2

In order to build rich applications deployed through the browser, you have two options: Flash and Flex or Microsoft Silverlight.

Flash is on 95% of machine today – if you are predominantly concerned about portability and accessibility then use Flash.

Silverlight is on only about 35% of machines, but Microsoft is heavily pushing to increase this adoption rate and it is now part of updates to Windows machines, but it is still a niche technology – this is important if looking to build deployable internet applications.

Gareth – What is Silverlight 2/2 – Caching, DataBinding, MVC, MVVM, LinQ, Limitations, Out Of Browser.

Why should we care about Microsoft Silverlight?

• Simple deployment (no installs; web-based accessibility)
• Rapid development (abstract web complexities; leveraging existing .NET capabilities)
• XAML in the browser
• Portability (1 API, 1 platform across all the different browsers)
• Easy coding

What do you need to get Silverlight on a machine?

• Silverlight pluggin (4mb download (Silverlight3); No reboot required)
• Silverlight .XAP file(serve from any web server)
• Your favourite browser

Where should you use Silverlight?

• Streaming video (high definition support; supports dynamic bandwidth scaling)
• Rich internet applications
• Line of business applications (Silverlight has a wide variety of components to assist with this: DataGrid; Charting; WCF; Isolated storage; Databinding; MVVM; LINQ)

Silverlight limitations

• Browser sandbox (no desktop integration; strict security model)
• Bulky XAP files (typical application = 800kb+ – Silverlight3 helps)
• Platform (No support for PowerPC Mac, Windows 98/2000/ME; Limited Linux support via Moonlight)
• Local storage (1mb – 25mb for out-of-browser) – can be used for anything you can come up with (it’s not limited to caching) e.g. a whole copy of a database can be brought across the wire and stored on a local machine – any interactions the clients make with the database are then synchronised backwards and forewards

Off-line modes are available – one of Silverlight3’s out-of-browser options key features is a network state connection feature so it knows when you are working in an online/offline mode

Rogan getting started with Silverlight (development environment)

Rogan – Silverlight Hello World and Model/View/View/Model Introduction

Rogan  – Introduction to Model/View/ViewModel pattern

What do you need to set up the development environment?

• Visual Studio 2008/Visual Web Developer
• Download and install the Developer tools for Silverlight (including the SDK, Visual Studio project templates, and developer runtimes) from Microsoft website
• Download and install Expression Blend = an interactive user interface designing tool for designing XAML interfaces (XAML = Extensible Application Markup Language)
• Download and install Silverlight toolkit = collection of extended Silverlight controls, components and utilities – examples included are: TreeView, AutoCompleteBox, Charting, etc (not a minimum requirement, but highly recommended). Important to note is that this is not a 3^rd party toolkit, but it is rather fully supported by Microsoft – as they continuously develop the Silverlight framework they are building a more complex and wider set of user controls in order to support it.
• Open Visual Studio – select “New Project” – Visual Studio now allows you to select “Silverlight application”.
• Select/Create a folder in which you wish to work – now you have a XAP file, which goes into the ClientBin folder.
• It then asks where you would like to host this application and then in the right hand bar, you will see that is has created a new website along with a default page, a Silverlight application, and a couple of XAML files and some code behinds.
• The code behind the application is straight C# code.
• For bigger projects it is recommended that you use a model view, view model framework, so your code is a bit neater and easier to work with – split solution into views, view models, interfaces and implementations

Debbie (http://twitter.com/debbiederman)

Building a Silverlight UI with Blend (1/3)

Building a Silverlight UI with Blend (2/3)

Building a Silverlight UI with Blend (3/3)

Development and Design

With Blend3 and Silverlight, it is possible for the developers and designers to work simultaneously and seamlessly, as the UI and data models are completely separate elements, which can be fused together through DataBinding at any point.

In order for the designers to create the design, especially for controls, they need to have something to bind to but if the models are not yet ready, then there is nothing for them to load into the data control so there is a concept of Design Time Data.

Design Time Data

Default Basic Project Structure

App.xaml – very key element because stores application wide resources

Main.xaml

ClientBin folder to host .xap file

Default.html – contains Silverlight object (can add initParameters to pass parameters to Silverlight object)

Blend

Each style has a target type property/attribute so you can’t apply a style made for a text box to anything other than a textbox

Silverlight Resources on the Web

http://silverlight.net

• - http://silverlight.net/showcase/
• - http://silverlight.net/learn/tutorials/

http://www.codeplex.com/Silverlight

http://blogs.silverlight.net/blogs/msnow/

http://weblogs.asp.net/scottgu/

http://timheuer.com/blog/

See it at www.africantourismportal.com

Tourism is, by its very nature, the act of deliberately taking oneself to somewhere foreign and experiencing the new, the different and the unknown.  That said, most tourists are not interested in stumbling blindly – they want to impose some sort of structure on their journey before they begin.  At the least, they book hotels and accommodation.  Many choose a few particular locations they want to visit.  Some even organise complete itineraries, planning their trips down to the hour.

For all of these people, there is a common problem: what is there to do where I’m going?  Frequently, the primary source of information is a tour book or travel guide – a glossy summary of the most popular attractions.  This information is flat, static, and offers little context.  An improvement is to use a tour operator – an agency who can help to guide you to local attractions and areas of interest, and customise suggestions to your interests and accommodation choices.

Wouldn’t it be even better, then, if you could explore the area yourself?  Whilst map-based products that show hotels or tourist locations have existed for a while, they have until now focused too much on either selling accommodation or on highlighting the tourist attractions.

Our Solution

This is where SmartGuide and New Media Labs have collaborated to bring these two worlds together – building a rich, interactive map that shows visitors where they can stay, and pairs it with a wealth of information about the area they are visiting.  As an interactive map product, tourists gain immediate understanding of the spatial relationships between locations.  They can explore at their leisure, consuming images, descriptions, audio and video about points.

The product we have built acts as a hub for a multitude of players in the tourism space.  Information, locations and content feed into it from local tourism agencies and location promoters.  Tourism and accommodation operators feed their own unique images/video/points into it, improving the quality of the content and highlighting features they consider the most valuable.  Tourists use the map to explore, learn and decide where they wish to visit.  They locate accommodation, restaurants and activities in advance, and feed their choices and preferences back to their tour guides or their queries directly to responsible parties.

TIP playing a promotional video

One of the dominant problems in providing a system like this is in developing and maintaining a high quality repository of information.  This is a task that is poorly suited to tour operators themselves, and individual local tourism bureaus cannot provide either the necessary funding or a wide enough body of information.  Here, a dedicated provider like SmartGuide has the necessary contacts and experience to compile a body of knowledge that can support both the regional agencies and the tour operators.

When dealing with as much content as this, it becomes necessary to manage the volume of information being presented at any one time.  Especially when people are viewing a map, overloading them with points can rapidly becoming intimidating.  SmartGuide and New Media Labs tackled this from a number of directions.  We manage the display of points, making them visible and hiding them at appropriate zoom levels.  This allows us to begin by presenting high-level information and a minimal selection of locations when the zoom is pulled far out, and still have detailed, local content if a visitor chooses to zoom into an area.  We further extended this by allowing visitors to bring categorised content up earlier.  This helps people locate their particular interests quickly – beaches, golf courses, family attractions, restaurants – all of these can be highlighted and explored at will.  Lastly, all points on the map have a context-specific icon, which makes it easy to distinguish the general nature of a location at a glance, and without having to click or interact with it.

Exploring Beaches and Golf Courses

This information is fed to tourists through a fully interactive Adobe Flash application, which leverages the exceptional quality of Google Maps for Flash to provide a geospatial display of tourist attractions.  The user interface is built to support simple reskinning by operators, allowing them to imbed the application into their own pages with a fully matching “look and feel”.

TIP reskinned for Southern Destinations

Uploading a path from a KML file

Obviously, managing all of this content requires tools that are up to the job.  Here, New Media Labs built a complete content management solution that allows SmartGuide and their licensed Operators to update and maintain the ever increasing number of locations.  The content manager is designed to make the job of sorting and filtering through the tens of thousands of locations easy.  It fully supports filtering and sorting, and allows the user to customise the information on display.  This allows SmartGuide and their Operators to “build their own interface” for the job at hand.  The content manager uses a combination of direct field editing and custom content-specific editors to always present the most useful interface for the moment.  The content manager allows them to not only monitor points, but also to customise the display of recommendations, guides, routes and layers.

It supports importing content from KML documents and route files, and adding additional regional/location information to points through a reverse geocoding service.  It even allows SmartGuide to generate customised HTML pages for their clients on-the-fly, allowing them to run their business without needing to call on New Media Labs for technical support.

Checking up on Sky Diving

The content manager isn’t limited to in-office use, either.  It is fully supported across the internet - and this often leads to SmartGuide consultants taking their laptops with them on the road, and updating content directly from the local offices of tourism agencies.

Underlying Technology

New Media Labs has a firm belief in using “the right tool for the job”.  As such, a variety of systems were used together to build the tourism portal.

The front-end application was developed using Adobe Flex technology.  Here, our challenge was to deliver a richly interactive application that would behave consistently across the multitude of browsers currently available.  It would need to provide a user experience that set it apart from the majority of Google Maps-based products currently available.  It would need to consume back-end service feeds and orchestrate them to produce a compelling, responsive interactive map.  Lastly, it would need to be customisable and skinnable enough that operators looking to integrate it fully into their websites had the flexibility to do so.

Our decision to use Adobe Flex was informed by all of these aspects.  With Flash penetration at over 95%, we felt comfortable that it had the portability we needed.  ActionScript CSS gave us a good tool to separate the presentation logic from the underlying behaviour, and native support of web services ensured that we could access our back-end content seamlessly.

Even better – it took us only 4 weeks to build the front-end application!  Our initial prototyping efforts using Microsoft Silverlight meant that we could focus on ensuring the user experience was top notch, instead of simultaneously developing the application logic in conjunction with the user interface.

Developing TIP in Flex Builder

The back end servers run web services hosted inside of IIS 7, running on Windows Server 2008 with SQL Server 2008 databases.  Whilst we investigated building the services with some of the more popular open-source technologies (PHP, Ruby on Rails), we knew that the long-term strategy for the system would require extensive back-end integration with the systems of existing content providers.  Here, we felt that services built using .NET would give us the best combination of performance, flexibility and rapid development on this project.  Especially, we viewed the introduction of the geographic data types within SQL Server 2008 as being important for the ongoing maintenance and development of the system.

The Content Manager was implemented using Microsoft Silverlight (SL3).  Here, we wanted a powerful and responsive interface that would allow the user to perform complex data manipulation quickly.  Microsoft Silverlight was a natural choice – the multitude of user controls provided helped to massively reduce the amount of work necessary to build a content manager.  By allowing the client to work with the data directly in their browser we allowed them to be much more productive than they could have been with a traditional page based CMS system.

Browsing and updating point information

Obviously, the CMS needed a way to update the primary data store – we evaluated using a traditional web-service based approach, but we wanted something that gave us a good mix between easy extensibility and strong validation and typing.  In the end, we built a generic dynamic update system that relies heavily on shared WCF contracts and reflection.  It allows us to provide continual, as-you-edit updates and synchronisation between the CMS user interface and the backing data store.

In a nutshell, the past few months can be summed up as 2 kick ass applications down and more to come!

Aurecon saw the need to develop a whole suite of new Incident Management Software for existing clients in areas such as Emergency Services, Disaster Management and Policing. Once they decided that immersive, graphical user interfaces were a must and Silverlight was to be at the forefront of delivering such an experience to their clients, it was only a matter of time before New Media Labs’ and Aurecon’s paths would cross.

You’re probably wondering what Incident Management has to do with New Media, well for example, imagine the possibilities of an Incident Management system leveraging off of something as simple as geoRSS.  Suddenly your system can subscribe to hundreds of different feed streams giving an Emergency Services Operation Center a wealth of valuable, visual information on a Map type interface. This opens up the possibilities of police officers, firemen, paramedics or even members of the public to be able to publish incident related information from their mobile phones and ultimately a whole range of operating centers can then subscribe to this real time information aiding them to overcome even the most disastrous of emergencies. This is where Incident Management and Social Media meet and ultimately, it is where New Media Labs can build a long term partnership with an awesome company, and use our knowledge and expertise in web technologies to help build awesome software.

Start Lite is the first system we helped develop. Without going into too much detail now, and rather saving more techno talk for the official showcase still to come, a high level definition for Start Lite is a lite, easy to use system that can quickly and effectively capture and initiate the start of an incident. It allows the user to pin point an incident on a fully interactive GIS enabled Map, specify the various details about the incident and manage any people or units that have been dispatched to the incident. Designed, developed and rolled out at a CCTV control centre in Cape Town, Start Lite is primarily (as the name says) a “lite” version of Aurecon’s next planned product called Start, which will cater more fully for other industries and clients in the Incident Management and Emergency Services fields.

Next we developed Back Office. Often police officers will be out on patrol and come across incidents that weren’t necessarily initiated by dispatch or a control centre, and therefore there is no digital record of such an occurrence and the resolution of it. Back Office caters for this. It allows the user to capture such incidents once they have finished their patrol and can get back to the station.

Both Systems are web based and were built with Silverlight 2 on top of WCF web services and a SQL 2008 Database. Not only are the systems easily deployed to multiple users, they run in a web browser and also look great!  Some of the components we used on both projects were:

• Draggable collapsible panels/containers. We utilized the open source Codeplex Blacklight Control suite and customized some of their controls to suit our needs better. http://www.codeplex.com/blacklight
• ESRI Silverlight Map Control, GEO Spatial capabilities of SQL Server and the ESRI Server web services. http://www.esri.com/silverlight
• Repositoy Factory. http://www.codeplex.com/RepositoryFactory
• Web Service Software Factory Modeling Edition. http://www.codeplex.com/servicefactory

Kobus Meyer and the rest of the guys at Aurecon have been extremely kind and accommodating in taking us in and making us feel like members of their team. Chris and I both have enjoyed every minute working with them and have also enjoyed enduring the everyday challenges faced when developing cutting edge Incident Management software. I look forward to the future of this ever growing partnership between Aurecon and New Media Labs.

Check out this awesome video by ESRI on leveraging ArcGIS, geoRSS to create situational awareness.