Project Looking Glass

What is project Looking Glass?

This was a project made up of two distinct pieces, one half pure design and one half architecture and programming. On the design side, Atmosera was hired to revamp the user interface (UI) and user experience (UX) of the application. Atmosera brought to the table a highly skilled design team to review the overall condition and needs of the system with respect to usability, navigation/flow, design consistency, etc., all with a view to the types of consumers that would be using the system. Design resources included a Creative Director, Information Architect and Design Lead, UX lead, Blend/Xaml developer, and graphics designers. After the review, design choices were made and the chosen enhancements were implemented. Design changes ranged from modifications to the overall navigation flow of the application; specific changes to graphics, colors, and fonts; creation of selected Silverlight animations or other effects to spice up the application and to help highlight the use of Silverlight technology.

On the architecture and development side, Atmosera was brought on to redesign the architecture of the Silverlight client to support Silverlight 4 and the MVVM pattern. The code was also migrated fully to Silverlight 4. Considerations for this part of the effort included:

Provision of a core framework that addresses the MVVM implementation, modularity, and extensibility using the Managed Extensibility Framework (MEF).

Isolated storage for caching where performance benefits were identified.

Conversion of the full client application to Silverlight 4.0.

Consideration of WCF RIA (Rich Internet Applications) Services and binary transport for the web services.

Full unit testing using the Silverlight Unit Testing Framework.

Why Atmosera?

Microsoft needed a partner that was expert in the three areas of .NET architecture, Silverlight development, and UI/UX design, plus the project management skills to coordinate the effort between both the design and development teams, and the Atmosera and Microsoft teams as well. Atmosera’s ability to bring to the table top expertise in all three areas was the deciding factor. Atmosera is a recognized leader in software architecture and implementation on the Microsoft platform, and complements this with a full digital design capability to meet the full range of customer needs for online software design, development, and branding.

Strategy

Atmosera began by providing a lightweight MVVM framework that leveraged principles from the popular PRISM framework and was built on top of MEF. This design facilitated a modular application that can auto-discover and register components for extensibility as well as dynamically load portions of the application on-demand to minimize the Silverlight footprint on the client.

Conclusion

The application relied on dozens of authenticated service calls, so the flexible architecture empowered Atmosera to build a mock service layer that enabled a fully functional runtime application even with the services offline. This helped facilitate faster development cycles and easier testing scenarios. The clear separation of concerns provided by the MVVM architecture also enabled development and design to move forward in parallel – in fact, a majority of the application was built and unit-tested before the first XAML file was generated by the design team. The designer-friendly view models and sample data enabled designers to see exactly what the application would look like in runtime using Expression Blend.

A clear separation of concerns also benefitted the development process when RIA services were considered, although it was later determined that the effort on the server side was out of scope for the project effort, so the existing services were used. Atmosera’s decision to abstract the service layer behind a set of interfaces meant this late decision had minimal impact on the overall schedule, as the service layer could be coded completely separate from the rest of the application. Unit tests ensured the integrity of the business logic so screens began to come together rapidly as the designer XAML effort merged with development.

With this project Atmosera was able to fully demonstrate the true power of Silverlight, Visual Studio 2010, and Expression Blend by building the application from the ground up in parallel with separate development and design teams and removed bottlenecks that typically occur during the design-to-production process. Unit tests ensured the integrity of the business layer as the design façade was laid with XAML, and a clean separation of concerns allowed almost 100% of the existing web service infrastructure to be used without modification despite the major improvements to the Silverlight client.