The following is a selection of some of the unique challenges our development team faced, and the solutions we delivered in response.

 

 

Project Highlight: Internal Data Dashboards

Beamworks has helped on several engagements with large corporate clients to build out the UI components of data-oriented dashboards, shoulder-to-shoulder with a team of consultant experts. Partnering with other technical principals, we were responsible for the presentation layer that assembles and displays data from disparate internal sources, evolving a complex “data explorer UI” user story.

Interactive, animated graphs, customizable pivot tables with hierarchical row display, dynamic type-ahead searching were integrated using GraphQL as bridge to backend code deployed in the enterprise data center context. High fidelity to designs and consumer-level user interface fit-and-finish were a priority. In addition, the team contributed to the raw dataset formatting efforts and ETL strategies to help fit the expected UX.

Project Highlight: Promotional Booking Platform

Our customer needed a bespoke booking workflow for third-party vendors to engage a team of brand ambassadors on retail floors of a large store chain. Beamworks built an application with a complex multi-step “wizard-style” interface to help users enter 20-40 pieces of information, including date ranges and data tables. In addition, capacity visualization and approval lifecycle UIs were implemented for a full administrative workflow.

The application was to be integrated into a traditional CMS – the team created a Gulp-based build script to manage the overall CMS theme, and then integrated Webpack and other React-specific tooling inside it.

Project Highlight: Online Interactive Healthcare

Beamworks worked with a Toronto-based healthcare platform provider to extend the provider’s React-based web front-end with advanced features such as realtime chat, a robust initial user onboarding experience and improved video call features. In parallel, the code compilation infrastructure was smoothly transitioned from using Browserify to Webpack.

The team confidently kept up with the project’s brisk timeline expectations and evolving specification surface. The build-out presented challenges unique to the healthcare industry: stringent privacy and compliance concerns, strong emphasis on simplicity, readability and usability, broad set of supported user devices (ranging from legacy PC desktops to iPhones).

Project Highlight: Google Chrome Calendar Extension

A mid-size product team needed to offer customers a custom browser extension to allow them to seamlessly add a new UI widget to their existing Google Calendar (in G Suite). The widget then communicated with the product backend to create new calendar events and insert information into existing ones. Full product branding was preserved across the embedded user interface elements.

Beamworks found a natural fit for a React-driven front-end architecture to power both the embedded custom UI widget inside G Suite as well as the browser toolbar dropdown used for session management. The development team customized a traditional Webpack build pipeline in order to automatically generate deployable Chrome Web Store artifacts; support for other browsers like Safari and Firefox was added as well.

Project Highlight: Desktop Video Client in Electron (Chromium Embedded Framework)

A Toronto-based healthcare platform provider faced a difficult UI challenge: needing to build a desktop video-call and screensharing client, while avoiding the costs of building and maintaining a dedicated native OS codebase. Beamworks helped architect and build a solution using a hybrid approach with the Electron native app framework as the foundation.

Our team built out a user interface using the React web framework and standard Webpack-based tooling to maximize codebase and skill reuse for the existing internal web development staff. Native SDK video frame and API calls were integrated into the JavaScript codebase using the V8/Node.js C++ add-on toolkit, keeping the C++ overhead work to a minimum. The resulting interface had no performance slow-down and benefited from the rapid iteration and lower costs of web-based development workflow.