The client turned to us with a validated idea and an MVP version of a web app designed for event floor planning. It is commissioned to be both a B2B and B2C solution that serves multiple purposes:
The project needed enhanced UX design, optimized graphic editor, considerable performance improvements, and the addition of a B2C e-commerce component. It also needed a bunch of other features developed such as file export and import, Salesforce integration, and user interaction. The business-critical challenge was to create a trustworthy platform event participants could use with full confidence to book exhibition space and make payments, thus streamlining the entire multi-step process for all involved.
In addition, our team developed a complementary product, Blueprint Pro. This is a web application that allows event organizers and exhibitors to use a 3D model of the floor plan they can provide to attendees by embedding it on their website and/or using a screen on site.
For the application hosting and the project infrastructure, we initiated the Galaxy to AWS transition. This saved the customer considerable expense on the Galaxy infrastructure they had been using, which is more costly and less powerful. Our team implemented the Continuous Integration practice into the development process to make it faster and more efficient. The product is built as a reactive single-page web application; the back end is written with MeteorJS framework, the front end in React. The graphic editor is designed using PaperJS which runs on HTML5 Canvas. We use MongoDB for the application database and REST API for application data exchange. The product is now connected to Freeman’s brand new products for event exhibitors and attendees also developed by Waverley – the Blueprint Connect Exhibit Portal and Blueprint Connect Attendee Portal.
A collaborative visual graphic editor for creation of the floor plans; file exporter/importer supporting DXF, PDF, and CSV file formats.
Show Management Settings and Administration for show organizers with custom options.
E-Commerce component for exhibitors to book exhibition stands and pay for them.
Salesforce integration and custom integrations with other Freeman applications, including Blueprint Pro, for additional functionality.
To improve the system’s performance, we had to deal with an interesting challenge: the volume of exhibits the software needed to be able to handle increased from 500 to 3,000; that’s six times as many stands. Also, some events may take place outdoors so floor plans could include additional objects and landscape features. Every new graphic element on the floor plan means more consumption of system resources. For these and other reasons, performance improvement has always been our primary task, and our development team has used a variety of optimization approaches, starting with DB collections optimization and deduplication of excessively denormalized data, ending with Meteor tweaks as well as low-level on-Canvas rendering wherever PaperJS didn’t demonstrate the best performance.
The e-commerce component was developed from scratch. It includes:
– Payment options through Stripe with powerful reporting and instant collection of funds, or invoicing.
– Shopping cart option for customers to be able to buy several stands at once.
Third-party services integration by customizing webhooks and API:
– Salesforce integration is a part of the B2C application component and allows exhibitors to choose and book exhibition space.
– Blueprint Pro and Other Freeman legacy applications FuZion and Exhibition Architect are supported by a wide set of integration capabilities on both API and webhooks levels.
– Integration with the new products from Freeman – Blueprint Connect Exhibit Portal and Blueprint Connect Attendee Portal.
When the Waverley team took on the project, the initial test coverage was pretty low (2-3%) with poor test quality. Our team has been working on increasing the unit test and integration test coverage (currently around 40%). For commonly reusable code, we strive to keep a 100% unit test coverage. For better unit testing, we also shifted to a more advanced Jest library that supports snapshot testing in addition to a session approach. This allows us to create tests for React components using less code and covering more functionality.
With the help of Waverley QA engineers, we managed to suggest certain UI design improvements that made the app more user-friendly. For example, our suggestion was to stop displaying certain windows or menu items to the users who have no access rights to them. This change lightened the application interface and decreased loading time. Our QA specialists also made considerable improvements to the testing process. Instead of the outdated testing documentation, we started using the TestRail test management system. It allows us to keep the test base, create and follow the test plan, track the testing progress, see the testing statistic data including the number of new and done tests, test status, tests organized by features, and other information. It also supports integration with Jira, which makes testing workflow smoother.
Currently, we run more than 900 manual test cases of the application, and this number is constantly increasing. This includes testing the application UI and graphic editor which is written with Canvas, a crucial task to ensure that all the graphic elements are built and displayed correctly in the application. Our QA professionals also do the application load testing with partly automated, API testing using Swagger and Postman tools, webhooks testing with the RequestBin instrument, third-party integrations testing, as well as testing of every new application feature and setting, including floor plan loading speed, file import and export, database modifications such as newly added objects, changes, or field values, data display, e-commerce Stripe and invoicing payment functionality.
In order to increase the testing pace and accuracy, and reduce the chances of man-made mistakes, we are continuously working to develop automated functional and visual tests with about 300 test cases using Cypress, Percy, and Selenium tools. With visual tests, we check Canvas elements – the system functionality responsible for the graphic editor component. They are not accessible for automated tests programmatically, so we use a snapshot-testing approach to check the correctness of every visual effect in the graphic editor. The automated functional tests check the overall user experience, including the interaction between user and front end, front end and back end, etc.
Waverley’s development team implemented a multi-user, real-time, highly visual web application enabling large-scale event organizers to design their exhibition floor plans in an easy CAD-like manner, produce technical plans for stand builders and crew, sell exhibition space, and integrate the sales tools into their CRM via an API.
By using the additional Freeman’s products for exhibitors, the event customers can also embed the designed user-friendly searchable 3D floor plans into their website/mobile app, use it in the kiosk mode on a device to be used by their attendees on-site, or leverage the brand new hybrid event functionality.
To read a written review by Freeman EMEA, visit our profile on Clutch.co.