NML

SHA

CMS, Custom Software Development, UX & Design, Front-end Build

The Pocket Underwriter is an online "specialist" that helps brokers explain insurance, identify risk areas, identify appropriate covers, and keep a record of the session with their client.

Project Overview

SHA's idea to create the Pocket Underwriter came about with insurance brokers in mind. Discussing legal liability issues with new and prospective clients has always been a tricky issue for brokers.

SHA Pocket Underwiter home page

The Pocket Underwriter is designed to be that “specialist” that helps brokers explain complex insurance covers to their clients, identify risk areas, identify appropriate covers, and keep a record of each session with their client(s).

SHA Specialist Underwriters approached NML to build the Pocket Underwriter as a website on NML's custom Content Management System (CMS) platform.

Key functions include:

  • the ability to generate quotes
  • to place the quote on-risk once the client has approved the quote, as well as
  • to renew policies that are reaching their annual renewal date.

Technology

  • Asp.net MVC 3
  • Entity Framework
  • Microsoft SQL Server
  • Unity
  • jQuery
  • Hangfire
  • Redis
  • HiQPdf

Architecture

The website was built on top of our core NML CMS which uses a tiered architecture and object oriented design:

  • Data Access Layer
    • SQL Database
    • Entity Framework
  • Business Layer - NML CMS
    • Content Manager to create, store and edit content, and also allows moving content between states such as draft, published and archived.
    • Media Manager to upload and delete images and documents.
    • User Manager to create, remove and modify users as well as their roles in the application.
    • Menu Manager to view and edit menus.
    • Custom CMS functionality on the SHA system:
      • Reporting to download reports regarding quotes, policies and CPD information.
      • Quoting Engine Data to upload files and data can be imported if needed.
      • Broker management to view broker information and bulk import broker users.

Design

SHA Pocket Underwiter policy page

The site was designed to communicate crucial yet relatively bland information in a captivating fashion. The design needed to aid the consultants in closing more sales and was thus created to be aesthetically pleasing, user friendly and deliver information as effectively as possible.

SHA Pocket Underwiter quote

User activity was also optimised for analytics tracking, reporting and documentation purposes. A unique breadcrumb system was created to aid navigation across devices whilst remaining consistent in user experience and appearance.

SHA Pocket Underwiter list of quotes

The UI was created using CSS (precompiled via SASS) and HTML. jQuery is used for front end session control and user guidance as well as for interactive calculation. Iconography and other visual resources are rendered via SVG to ensure lightness, crispness and re-usability. CSS3 animations and transitions are used for interaction, leading to smooth, delightful use. The system code was meticulously implemented and has undergone rigorous device and browser testing.

SHA Pocket Underwiter icons

Due to the wide range of industries covered by the application, an icon library of over 50 icons was created.All icons were created to be easily readable on a constrained screen size, and simultaneously also look good on larger screen sizes. Visual consistency across all the icons was also of great importance.

The site was created to support a wide variety of devices and browsers mainly due to consultants using their own devices, and to provide clients with ease of access to information.