Jacob
Jay
Jacob Jay

Peripatetic British full-stack developer, designer and entrepreneur.
Specialising in web applications and usability.

8 JavaScript projects

Website for PowerMeals

Replace a highly customised WordPress/WooCommerce system for a meal delivery service with a high-performance adaptable platform.

Innovations

  • Involved reimplementing an algorithm originally created in Excel with recursive iteration upon all the possible meals by the number of desired meals which whilst logical was costly, and not being particularly capable with such techniques I reduced it to simply iterating all meals (typically around 50, before excluding those not matching diet) for a max n times, not adding similar or identical meals until subsequent iterations to ensure variety, so decreasing variety with each iteration after diet protein distributions are fulfilled (easy in the case of carnivore, harder in the case of flexitarian). This generally completes in a few iterations, and in rare cases where diet is restricted it doesn't require too many more. When necessary it will flag an account as having an overly restrictive diet that could not be automatically allocated an adequate variety of meals.
  • Introduced the ability to no longer require an 'active' account to place an order, and therefore also changed copywriting and terminology to be more explanatory e.g. retired 'subscription' in favour of 'recurring deliveries' that could then be switched off. When off, orders are only created and allocated on-demand when the customer returns, not as part of the batch processing.
  • Deprecated the (unsustainable and gamed) use of a payment grace for the first order on signup if payment wasn't settled.
  • Introduced the 'flexitarian' diet with a data structure for proteins on each diet permitting percentages to be set for each being used in automated allocations. (Would also permit each customer to set their own, but not implemented.)
  • Simplified ingredient and exclusion handling, utilising inheritence, categories and inverted diet flags (e.g. not-vegan, not-vege) on each ingredient.
  • Improved meal cards with subtitles, and label/sticker overlays.
  • Replaced the basic printing of postal service labels as only permitted in WooCommerce, with a bespoke system including generation of the Odoo stock picking barcode printed on the same delivery label, greatly simplifying the pick+pack process. (This was phased, early releases instead used sorted printed picking lists and labels, to which a short weekly internal consignment identifier was added, i.e. every consignment could be uniquely identified within a given week even if delayed, and the number generally being 3–4 digits making it easier to match by eye, versus previously attempting with an entire recipient name.)
  • Bundled SKUs, e.g. buy a group of items at a discount, with all products items ised individually.
  • Implemented receipts instead of 'invoices'.
  • Simplified customer and order references, where customers are given a short alpha-numeric code, and orders simply use their date, e.g. 241201-AB (PNR).
  • Improved formatting of localised values e.g. Swiss prices, and dates.
  • Far easier customer lookup in the backoffice, with default selected search allowing instant typing or paste of name/tel/email.
  • Use of the Moonstalk stack with the Openresty and Tarantool application servers.
  • The entire platform went from multiple second waits in the Wordpress backoffice to simply see orders, to sub 10ms render times across all pages including complex backoffice queries.
  • Lightweight json payloads in each language comprising the weekly menu and ingredients for the client-side application.
  • Many pre-cached data (e.g. products per menu) generated in the webserver avoiding the need to query the database, or generated as a cache on a schedule in the database and loaded by the web server.
  • When the scheduled batch processing fails (regrettably not infrequent due to Odoo issues) it can simply be re-run manually.
  • Statistics on most daily operations to ensure smooth running, with a daily recap and individual signups requiring review posted to the Slack channel.
  • Emphemeral datasets in records discarded when no longer required, by segmenting the orders into current and archive, where current orders contain production details that are not relevent to keep after production. (Whilst not needed at the time, it significantly improves performance should the dataset grow.)

Features

  • Fully translated and localised for Switzerland in English, German and French.
  • Weekly menus comprising changing meal and extras SKUs.
  • Client-side basket checkout for selecting, filtering and pricing.
  • Menu and product data also utilised in dedicated non-customer menu pages, with a basic CMS for managing categories.
  • Dedicated 'trial' package checkout having set delivery charges.
  • Customer dietary preferences include filtering.
  • Coupons (discount value) with a variety of use scenarios, plus vouchers (cash-credit value), and gifts (rewards) to be claimed upon passing thresholds.
  • Flexible holiday rescheduling for closure days (albeit not implemented fully abstractly).
  • Utilising fairly standard scheduled early morning batch processing for credit card payments, initially using Stripe, then replaced with a Swiss payment gateway, and other methods; also downloads postal service waybills for labels, amongst other functions.
  • One grace order when automated payment settlement fails. (Improved customer retention.)
  • Integrated HubSpot for CRM, with many recurring API updates syncing customer state changes, such as activating or deactivating recurring orders, which is then used for automated emails.
  • Implemented sending orders to the hosted Odoo service for ERP and production, including carrying out order confirmation; further integrations planned.
  • Migrated data from multiple millions of Wordpress SQL rows, many duplicated or deprecated, and actually only representating less than 10,000 records after migration (Demonstrating the impracticalty and high overheads of WordPress/WooCommerce as a platform.)
  • Included training the frontend dev (JS/PHP) in basic framework, Lua and Tarantool usage.
  • Included the initial design, subsequently handed over to a frontend dev, and new designer, but loosing the nuanced/cleaner typesetting I had applied; usability advice is ongoing.

Links

2023 — Development, Web, E-commerceSummary ↙︎
Details, 14 images

Hybrid Point-of-Sale for Paylinko

Create a platform enabling small businesses and contractors to take card payments in-person.

Innovations

  • Utilising RFID/NFC smartphones to improve customer interaction in completing payments, requiring development of both UX and API between the user-presented web interface and native routines in an app. Existing card payment UX (in the west) was limited to using a camera to capture the card details (rarely used) or manually typing details in, being unreasonable to expect both parties to have the same app/system (unlike developing countries, such as with USSD solutions).
  • The UX had to be carefully considered as it was taking place on a smartphone handed to the customer by their service-provider, in the manner of a bill to be paid there-and-then.
  • My solution simply involved tapping a contactless payment card to the phone and then entering the 3-digit CV2. The app having been developed to invoke the NFC card reading on the payment screen. Because this only reads the card details rather than using the encrypted contactless payments channel, payments could be settled in the usual manner, and for any value above the usual contactless limit.

Features

  • thin (hybrid) mobile app wrapping the website functionality with native NFC and camera card reading
  • backoffice to review submitted documents and automated account progression through third-party identity verification/KYC
  • short merchant-id generation for statements
  • third-party account settlements
  • overloaded the default status and error handling, redirecting to Slack for real-time devops and account insights

Links

2017 — Conception, Web, E-commerceSummary ↙︎
Details, 0 images

Product Website for Esofaber

Site to promote and sell a specific product line.

Innovations

  • Bespoke image slider handling multiple content parts (image, title, subtitle, price, inset image) and integrated as the core compoent of the page layout
  • Image slider waits for the next slide's image to finish loading before progressing to that slide (a common issue on slower connections with every other slider implementation)
  • Shows the name of the next item in the slider

Features

  • Responsive design (adapts to screen size and orientation such as for tablets)
  • Feature products in the front page slider simply with tagging
  • Automatic slider with manual controls
  • Web fonts (to match the product aesthetic)
  • Localised prices and shipping notices
  • All the Moonstalk Kit optimisations (e.g. typographic prices and async JavaScript loading

Links

2011 — Design, Web, E-commerceSummary ↙︎
Details, 1 images

Website for CBX / Sulzer Infra FM / Axima FM

Upgrade of site for service provider.

Innovations

  • Dynamic content selection with fallbacks for overlapping country/language static content employing dynamic URLs and a metadata store
  • Publishing of short video editorials
  • Visitor survey (bespoke aquisition with off the shelf desktop analysis)
  • Automatic what's new feature using the metadata store

Features

  • Heirachical structure for 100+ pages with multiple regions and languages
  • Press area including image gallery, PDF clippings and video editorials
  • Callback request facility
  • Registration-only articles
  • Video
2001 — Design, Web, Content ManagementSummary ↙︎
Details, 4 images

Website for ASHTAV

Site for UK association.
Function

Features

  • Multiframe navigation with javascript reload
  • Member database with profile editor
1999 — Design, Web, Summary ↙︎
Details, 1 images

Website for S.Com

Multi-country sites for recruitment consultants.
Function

Features

  • Use of multiple frames with targetted reload for secondary navigation.
1999 — Design, Web, Summary ↙︎
Details, 1 images

Website for CBX / Sulzer Infra FM / Axima FM

First site for service provider.
Function

Innovations

  • Javascript/cookie visitor aquisition and access restriction system for articles
1999 — Design, Web, Summary ↙︎
Details, 1 images

Intranet for CBX / Sulzer Infra FM / Axima FM

Improve the usability and presentation across an intranet uniformally, following a rebranding of the company.

Innovations

  • Use of tabbed-UI and javascript popup menus to maximise functional real estate whilst providing two-click access to almost all areas of the system.
  • Color coding of tabs and areas for ease of identification (in an earlier implementation).
1999 — Design, Web, SocialSummary ↙︎
Details, 2 images