Website Redevelopment with Interactive Map & Directory

Supporting Our City of Independents

York Independent Business Association (YIBA) inception came about after businesses in York were severely impacted by floods that came on Boxing Day during 2015. With concern for the future of traders in the City, Indie York secured funding for the creation of a website.

The website was initially launched in November 2016 as a prototype to promote collective brands, showcasing York’s wonderful alternatives to the usual high street names. During this time Indie York has successfully bought businesses together through the website, social media and paper map. These channels have continued to provide a useful and engaging guide for residents and tourists alike.

Since its initial launch the website received growing desire from YIBA and its members to extend and improve the functionality. In particular for YIBA to remove inefficient manual processes by adopting technology to streamline processes and improve support for its members. Utilising Google Analytics data, direct feedback from YIBA and its members this collective insight confirmed the core focus areas for the redevelopment project.

Development Opportunities

The prototype website presented opportunities that were all solvable and to some extent the natural progression to support the needs of any growing website:

  • The hand illustrated map was not to scale therefore no user location or online mapping tools could be utilised to help visitors find member locations easily.
  • Visitors had no easy way to search by business category or the ability to view the map and directory listing together.
  • Social sharing was limited with little opportunity for engagement and sharing of content.

Website Redevelopment Goals

During the spring of 2019 YIBA continued its partnership with I-Finity to redevelop and redesign the website to:

  • Improve the experience for website visitors with more user-friendly features
  • Provide operational efficiencies across member sign up, payments and renewals – ultimately removing all manual processes
  • Enable operational savings by automating and streamlining interactions
  • Enable members to securely access and update their own business profiles

Technology to streamline processes

Member Sign Up and Approval

This delivered significant benefits for new members to register online whilst enabling YIBA to adopt a streamlined way to manage the approval process within Umbraco Content Management System (CMS). Once YIBA approves new member requests, each approved member is granted access to their dedicated Member Profile area.

Securing and protecting data online:

Security forms an essential part of I-Finity’s technical architecture to ensure all data is protected to meet both compliance and industry best practise standards. These standards are needed to effectively defend and protect against any potential online threats. The new member form requires a username and password to be created. This process for signing up, requesting forgotten passwords and resets are all managed within Umbraco CMS securely. Best practises have been implemented for security such as data encryption at the database level, all passwords are salted and hashed, this means no password data is readable.

Member Profile Management

I-Finity developed a dedicated member profile area for each approved member to create and update details about their business. Quality assurance is supported with built in form validation and an approval process within Umbraco CMS for YIBA to approve all profile changes before anything becomes visible on the website. The quality of the imagery being uploaded is protected by auto-cropping and re-sizing to ensure all imagery is optimal for the design of the profile pages.

Secure Online Payment and Automated Renewal Process

Utilising technology to securely process payments and automate membership renewals was a much-needed capability to support YIBA’s growth plans. Therefore, quality time was spent upfront planning how online payments and the renewal process needed to work to support YIBA’s membership model. The planning time spent upfront enabled the capturing of user requirements to support the Agile development process. The solution was an integration into GoCardless supported with the development of a customised renewal process.

Partnering with Local Illustrator to keep Indie York brand consistent

Complete Redesign

Central to the website design included how the hand illustrated map, artwork and logo assets could be used to reinforce the updated design for brand consistency. Whilst at the same time enabling the much-needed improved user-friendly features.

I-Finity worked closely with a local Illustrator (Emily Hayes) to capture all the assets, artwork, typography and colours into web ready formats. There was a balancing act of delivering on brand and optimising for search engines – for example, handwritten signs are not readable for search engines therefore a missed opportunity to have content indexed. Working in partnership with YIBA a balance was achieved to support search optimisation whilst keeping on brand with the printed map.

Google Maps API enabled I-Finity to fully customise the theme to match the colour palette of the printed map. Within the website itself the typography and artwork has been incorporated in an accessible and web friendly way.

Delivering on the much-needed improved functionality and user experience

Delivering on the much-needed improved functionality and user experience

Design and Development being fully Mobile Responsive

There is much more use of mobile phones and the use of smaller screens in our daily lives, therefore I-Finity always builds for mobile first. This approach leads to a fully responsive website with no loss of functionality where both design and development complement one another. It was imperative that the map and directory listing functionality worked exactly the same on larger desktops to laptops to smaller mobile screens to provide a consistent online experience.

Cohesive Experience with the Interactive Map and Directory Listing

The redevelopment focus was to improve usability in the core areas that are important to day-to-day users such as the map and directory listing experience. The online map was fully customised to deliver a consistent brand experience whilst allowing visitors to have the best online experience – this was achievable by utilising Google’s well established and mobile-responsive mapping functionality.

To enhance the interactivity of the map and encourage visitors to view more member listings, I-Finity’s solution offers a merged view of the map and the listings for a more usable look-and-feel. The listings are visible to one side of the map, and the pins on the map itself interact with these listings. The user can toggle between this new map view, and the standard list view along with selecting business type categories to narrow down results. The key driver for this development was to offer visitors a meaningful and easy way to explore the map and directory listings.

Surfacing relevant content with Geo-Location

The map experience enables a visitor to grant the web browser permission to utilise current location. HTML5 Geolocation has enabled the surfacing of content relevant to the user’s location within York. This only happens if a user grants permission otherwise it will focus the user on a central point of the map.

The map and directory will surface location specific businesses that are closest to the user’s current location. I-Finity’s aim was to provide functionality that makes it easy to find relevant content in a meaningful way without overwhelming visitors. Once location is granted the map will update to focus on the location provided, it creates a new pin on the map to show the users location amongst the pins of independent businesses that are closest.

Social Media Integration

Indie York is extremely active on its social media channels especially with Instagram to continue providing promotion and awareness of all its members. Therefore, YIBA were keen to display the daily activity on the homepage and this was achieved with an integration into Instagram to automatically pull feeds for continuous updates.

Onsite Search

Improving usability and surfacing relevant content have been core areas of focus throughout the redevelopment. Whilst the map and directory listing experience are supported with location specific capability and filtering options, it was still beneficial to provide visitors with a site wide search. Umbraco’s built in Examine Search capability provided I-Finity’s development team with full customisation to build to exact requirements. Search results were optimised for relevancy to deliver a positive user experience. This feature is built to search a vast amount of content therefore it is fully scalable and performant to continuously deliver instant results to website visitors.

Powering Indie York with Microsoft Azure Cloud

As specialists in cloud technology, Indie York website is powered by Microsoft Azure Cloud technology, to provide:

  • Speed of scalability and resilience with the added advantage of dynamically adapting in accordance with performance and utilisation needs.
  • Comprehensive data backup and disaster recovery with point in time recovery for minimal disruption.
  • High availability and performance with an uptime of 99.95%.
  • Security and protection of data – with Azure it embeds security, privacy and compliance into
Working with I-Finity was an absolute pleasure; from initial meeting to regular updates and support meetings they made the whole process very client friendly. Coming from a non-tech background they provided excellent and very clear guidance and tuition enabling me to use the Umbraco website editing. Their patience was much appreciated. I would have no hesitation in recommending them to anyone needing a personable, creative and knowledgeable tech company - Sara Amil Smith, Indie York Administrator (York, UK)
I- Finity have worked with Indie York over the last 4 years and have always been very efficient and responsive to any updates we have wanted to make. They recently provided us with an excellent update to our website that has made a huge improvement providing some excellent new features on our new website. This we launched in February 2020. That remodelling is excellent and has been very warmly welcomed by our 200 plus Independent business members. I have no hesitation in recommending I-Finity as a website developer and for ongoing technical support. They are a very thoughtful and capable company. - Johnny Hayes MBE Chairman York Independent Business Initiative. (TA Indie York.)

YIBA’s objectives are being realised

  • Indie York started with 30 businesses, has now grown to over 200 and it continues to grow.
  • Benefiting from automation efficiencies has removed time-consuming manual processes
  • Website, printed map and social media continue to work together to promote York - City of Independents

Get in touch