Jacob Jay

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

8 CSS projects

Directory for Cooperative Coliving

Website with categorised and filterable listings of coliving spaces for workations.


  • Filter flexibility on some classifications as enumerated scales (e.g. outside spaces from terrace to big garden; workspace from bedroom desk to coworking) enabling results to be expanded with degrees of relevence, instead of simply returning unhelpful 'nothing matched'.
  • Multi-faceted classification system uses both structured and unstructured tags; which may be grouped by parents, optionally redirecting and hilighting child tags; plus enabling customisation of every view where values are consumed.
  • Freeform rates, in which multiple unit classes may be declared with any duration and rate; the system creating summaries of these for common cases (e.g. weekly and monthly rates).
  • Unusual mobile UI giving access to an almost fullscreen map with information panel below it as a single swipable view, instead of the more typical multi-modal/click-panel-close interactions. (Usability value to be ascertained.)
  • SPA-style client-side mapping and filtering, using a compact base dataset, maintained as JSON, supplemented with per-property JSON data upon user interaction, thus avoiding server-side dependencies and database queries. (Obviously only capable of handling a smaller datasets, though under 75k gzipped for 1500 properties, not likely to be exceeded for many years.)
  • Tags for all filter criteria preserved in the URL facilitating sharing. Clicked properties are preserved in the query string thus do invoke a server-side response to permit sharing when first accessed with a property query string.
  • Given a huge variety of spaces and users, anonymised and unrated reviews to focus the user's attention upon their own interpretations.
  • Fallback client-side rendering, should the server be unable to cache Instagram using a private API.


  • The use of tags in a provider-specified order to classify spaces also supports a self-declaration community label/marque using the logo, in which any space may declare itself a "coliving community" by prefixing its core offer or values as tags e.g. «Hub House is a #purposeful #cooperative Coliving Community».
  • Data stored in easily edited structured text format (Lua).
  • Third-party data sources (e.g. Instagram, Facebook, Google) cached on the server to eliminate additional latency.
  • Passable/overridable filters in URL, as well as settable with cookies, this statefulness allows the map and list views to be shared preserving the user input criteria.
  • Some data always in-page for instant client-side changes and reduced server processing, and when unspecified shows all spaces in list view with 'disabled' styling thus ensuring all potential results appear on pages for SEO and first-time visitors. If prefs are set or passed the server trims the data set to send a lighter load.
  • Unstructured locations and contextual adjustment derived from declared human-friendly strings, e.g. "Barcelona, Spain" only appears as "Barcelona" on the Spain page, but a space may declare it as "near Barcelona" or anything else appropriate for reference instead of displaying simply an unhelpful administrarive name.
  • Tags permit optional space-specific custom details, e.g. the "meals" tag can be expanded with free-form text such as "full-board included".
  • Friendly URLs e.g: /in/spain /with/pool
  • Custom pages can replace or supplement entire categories; CSS can also easily be used to make changes to specific categories.
  • Currency conversion with rounding to faciliate user information scanning and consumption.
  • Instagram photos only render the two most recent official account photos, also showing both top-ranked and recent location-specific posts (where an Instagram location is known).


2020 — Conception, Web, Content ManagementSummary ↙︎
Details, 8 images

Website for Playworking

Responsive interim website for a destinational coliving space offering outdoor activities.

2018 — Design, Web, Summary ↙︎
Details, 5 images

Product Website for Esofaber

Site to promote and sell a specific product line.


  • 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


  • 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


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

Estate agency SaaS for duHome

Provide a customisable website for estate agencies.


  • Fuzzy-logic search, gradually widening search criteria scope when not enough matching results are found, i.e. for every non-matching input criteria a corresponding potentially acceptable criteria would be used instead such as 1 bathroom instead of 2, with these criteria being colour-coded (match versus near-match).
  • Comprehensive type-ahead search using multiple sources of data (names, telephones, locations, emails, prices), removing need for time consuming paging of adminstrative list views to find relevent records.
  • Use of geohash indexes for high-performance geospatial property search.
  • Use of deferred slideshow loading to improve performance and usability (almost unheard of at the time, most solutions simply advancing to to half-downloaded images on a timer, or attempting to download all upon page load despite potentially not subsequently showing them).


  • Customer-facing functionality including geographic search and display of properties with mapping and slideshow
  • Agent functionalities including search, management of properties
  • Agency-owner functionality including customisation and configuration of website, and management of agents
  • Support for multiple agency locations per site, and agents per-agency
  • Activitiy streams with messaging and notifications for each agency, agent and property
  • Signup for new agencies (clients) with a default name-derived subdomain
  • Automatic geo-location and address completion when adding properties
  • Image upload and optimisation for slideshows
  • Email notifications when agents are not active on site
  • Property owner CRM with agent association
  • Editable print view with QR code for window display
  • Utilisation of Moonstalk's internationsalistion, geospatial data, type-ahead search, and notification features
2011 — Conception, Web, Content ManagementSummary ↙︎
Details, 8 images

Marketplace for Verse

SaaS platform for small independant retailers, with a focus on curation and provenance, including product blogs and stock-control.


  • Customisable magazine style multi-product 'display' layouts, using an impactful large format image tagged with the products, with their data (price, links) automatically populated.
  • Uncluttered single product layouts with clear call to actions and availability.
2009 — Design, Web, Content ManagementSummary ↙︎
Details, 2 images

PictureSync Website for Verse

Seperate site with service-provider/affiliate specific branding and downloads via referrer or argument.


  • Ability to serve a ready-to-use service-provider specific download, hiding the other supported providers from the user.
2007 — Design, Web, APISummary ↙︎
Details, 1 images

Folio Concept for Verse

Product concept, branding and website for professionally-oriented photo portfolio service.


  • SaaS with SSL on MivaScript
  • Flexible CSS boxes with custom edge and corner frames
  • Research on hosting latencies for optimal single-location US deployment across metro areas


2005 — Design, Web, PhotoSummary ↙︎
Details, 1 images

Website for Verse

Mac software publisher


  • Combined version tracking and licence verification protocol (between webserver and desktop application), with an entirely web-based activation procedure (transparent licence key) [see the blog]


  • Purchasing integration with PayPal
  • Software licence generation and activation
  • Software version tracking and usage reporting
2004 — Design, Web, APISummary ↙︎
Details, 1 images