Introduction
The Lightwire Hosting website is one of the most complex websites I have built by far, and is still undergoing continuous development and improvement. This site has helped me get a grasp of web development best practices, methods of integrating billing systems, credit card processors, and more.
Design
For design, we have gone through numerous iterations through the years, before settling on the current design. This design, we believe best suits the brand and speaks to our target audience. Mixing cool, cutting edge, and smart, this site is designed to deliver customer confidence in a relaxed product best suited for the casual gamer. Our initial designs focused more on an in-between of your average small business owner or entrepreneur & the average casual gamer, trying to blend game hosting alongside traditional webhosting. Through time, alongside trial and error, we learned that this was not the best idea, and thus we were forced to restrategise our entire brand design concept. This involved a total refresh of all branding elements, including Logos, Colours, Website and Message. After further consultation with in-house and external designers, we settled on a mockup that expressed a clean, modern look, a complete departure from the existing design system.
Mockup created by AZXYC, go check him out here
Our primary colour changed from using
Another focus of ours was optimising the landing page for a clean look. I re-did the hero from the ground up, with new colours, a new custom background with abstract line artwork alongside an animated gradient, and redoing the interactive and informational elements entirely. Instead of cramming all of our talking points into the hero, we kept it simple showing our latest offer and lowest pricing, while letting the rest of the page do all the talking.
Original Lightwire Hosting website design
I revamped the rest of the site's design by replacing the tier-list with a display of a selection of the games that we offer, and also added a region display.
Development
CRM
One aspect of the development of the Lightwire Website is the built in CRM system. Our CRM had to be designed in a way that would be able to integrate into our existing Internal Management System (IMS) using REST APIs, and also allow for login by staff to directly interact with Lightwire Customer accounts or respond to tickets. We also had to manage the integration with Stripe for Billing purposes. One challenge we faced was storing data independently, but linked to Stripe. Transactions that occured on Stripe had to be traceable to Stripe, however we have to also process transactions that occour outside of Stripe, such as on PayPal, Zelle, SEPA, E-Transfer, and other methods. This required us to maintain some duplicate data. The result was keeping a minimal amount of data on Stripe in regards to products, and primarily querying our own database for product data, while maintaining a reference to Stripe for all pricing and transaction data. Thus, if an off-stripe transaction occurs, we can refer to our own internal product data, rather than referring to a Stripe product which could break some flows as there would not be a customer instance created in the Stripe system for that user.
Billing
The Billing component was further tricky, as our products do not use a standard check-out system, as we are setting up subscriptions. Before allowing the user to create a purchase, we require them to add a Card on file, or otherwise we provide them with Account Credit if they pay using one of the alternative methods. In order to prevent unecessary errors or chargebacks, we setup our system to deploy a user's server instance before charging their card, and if it fails, the card will not be charged. Otherwise once the server has been successfully deployed, the user's card is then charged, and will continue to be charged on a recurring basis until they cancel. We had to setup our own cancellation method integrating with the Stripe API, that deletes the server instance, and then updates the Subscription object.