Over the last couple of years, I’ve become engrossed in the
craft beer scene that’s becoming popular across the globe. Particularly in
North America, the UK and Northern Europe.
The scene is booming with exciting new bars and flavour-forward beers.
After having visited a plethora of these bars and given the
fact I can’t help but think about the technology, I’ve realised that there are
a number of things that could be done better.
After meeting my partner, who actually works in one of these bars, I’ve
become certain of this fact.
The two things that are most lacking, in my opinion, are the
lack of an easy to use, feature rich point-of-sale application for bartenders
and the lack of a real-time feed between the bar and its customers. Beer nerds love to be able to survey a bar
before heading there, to discover whether there is anything rare or interesting
Hoppy seeks to remedy the above by providing a point-of-sale
application for Windows 8 tablets (to be used on the floor), a web service to
receive and track sales information and tap changes and a website to display what’s
currently on tap.
I’ve been working as a Software Developer for the last five
years, recently becoming a Technical Lead with my employer, focusing on designing
and building elegant, networked geospatial applications. In this time, I’ve learned a great deal about
WPF, the .NET framework, ASP.NET and web services. This has given me the skillset required to
tackle large, multi-faceted solutions.
I’ve been heavily involved in the craft beer movement for
the last couple of years and have participated in technical support with an
Edinburgh craft beer bar, sorely becoming aware of the poor quality of the available
point of sale software designed for bars.
I also spent about five years working in retail, so I’m familiar with
standard point of sale solutions.
Components and Technologies Overview
As briefly mentioned in the introduction, the application
will be split into three main components.
- Point of sale application which runs on Windows
- Includes an administration mode which allows for
cellar personnel to enter stock, perform reporting and swap taps.
- Would like to support authentication via thumbprint reader, though this will mostly depend on whether there's an free/open-source API available.
- Technologies: C#, .NET 4.5, Reactive Extensions,
WPF, MVVM, JSON & SQLite.
- Point of sale server. Runs in Azure and will be provided
as a hosted solution for end users. This
will also be released as a standalone web service.
- Technologies: C#, .NET 4.5, Azure, MVC 4, Web
API, IIS 7.5, JSON, Entity Framework & SQLServer 2012.
- Taps website. An ASP.NET MVC4 website which will
display taps for a given bar. Runs in
Azure and will be provided as a hosted solution for end users. This will also
be released as a standalone website.
- Technologies: C#, .NET 4.5, Azure, MVC 4, IIS
7.5, JSON, HTML5/CSS3/JS, Bootstrap, Knockout, and jQuery.
Click any of the images to view a larger size.
Main Taps Display
Password / Thumbprint Authentication
Sample Instance of Hoppy Taps
As described in the introduction, the application will be split
into three main components. Hoppy (which runs on the tablet), Hoppy Server
(which runs as a web service and is hosted in the cloud) and Hoppy Taps (a
website hosted in the cloud). A visual
representation of these components and their sub-components is shown below.
This application is being built using a standard Model-View-View
Model (MVVM) approach. Model classes have
been created to represent transactions, stock items, tap updates and accounts. I’m using a REST client to pull these from
Hoppy Server, which will push updates via Reactive Extensions (Rx) onto the
ViewModel, and in turn, update the View, which in this case is a WPF Page. Any changes or transactions made on the
tablet will be pushed via the REST client to Hoppy Server and stored locally in
the SQLite cache.
Hoppy Server is an MVC 4 / Web API application which handles
received transactions, stock changes, tap changes and balance updates for
accounts, essentially providing synchronisation support for a multiple tablet
environment. Model data will be stored
via Entity Framework in a local SQLServer 2012 instance. There will also be a public API available where
current taps can be queried; this will be used by Hoppy Taps.
The current working database schema is shown below, the
majority of tables have a one-to-one mapping to a Web API controller, which has
been populated with CRUD methods.
Click the schema above to see a larger size.
Hoppy Taps is an MVC 4 website which queries Hoppy Server
using JQuery AJAX, stores the results in a View Model and binds these to the
page using Knockout. This is a fairly
simple application with one only page and is designed to be integrated into a
bar’s existing website.
Status and Further Work
At time of writing, each component has been mocked up using
sample data view models and is currently being fleshed out with code. I expect that in a couple of weeks, most
parts of the application will be functioning, with the remainder of the
functionality and polish being added a few weeks later.
Code snippets & design diagrams will continue to be
posted as the project grows.
- Hoppy - 10%
- Current work is on designing each page and its respective ViewModel.
- Next: Integration with Hoppy Server.
- Hoppy Server - 50%
- Current work is on fleshing out scaffolded Web API controllers.
- Next: Investigate any synchronisation issues.
- Hoppy Taps - 75%
- Currently working on polishing the user interface and adding additional UI elements (such as tap name, tap type (cask/keg), quantity remaining and when the beverage went on tap).
- Next: Packaging up the website for download.
Further Work & Ideas
I want this application to be a market-leading bar
point-of-sale system. As such, I have some ambitious ideas in the works for
after this version of the product is completed. These are as follows.
- Automatically posting tap changes to Twitter,
i.e. ON: <Beer Name>, OFF: <Beer Name>
- Publishing a bottle list automatically for those
interested in rare bottled beverages.
- Publishing food items, snacks, and other
- A customer mode of the software which can be ran
on a tablet that faces the customer; this could be used to recommend beverages
based on favourites, find out more information about a beer including its
rating on beer rating websites (Untappd, Beer Advocate, Rate Beer, etc).
- Web-based reporting facilities to display sales
history, profits, efficiency/waste, customer spending habits & popular
- Barcode reader support for easy addition of stock by cellar management staff.
- Platform: Windows
8 Tablet (as a full-screen, touch-aware desktop application; not Metro/Modern
- Category: Retail
5, and CSS3
- 4 September 2013 - I've spent some time working through some of the remaining page design. I've updated the article screenshots to reflect the pages as they exist at the moment. I've also decided that I'd like to include support for a thumbprint reader, and I'll be investigating whether this is feasible with the scope of this competition.
- 21 August 2013 - Initial version.