Our blog

design, code, business & everything in-between

pebblecode.com gets a makeover | part two development

pebblecode.com recently got a makeover. This post is going to be about the development and the tech used. If you’d like to learn about the design process you can see part one of the story here.

Design lead

When the design team was given the brief for the new pebble sites, we were told that the project should be ‘design lead’ and we took this to heart straight away. When designing for the web it’s possible to let development concerns limit your creativity and this was something we were weary off from the start.

Read More

Share your thoughts with us on twitter

markdurrant

17th March 2014

pebblecode.com gets a makeover | part one design

Recently here at pebble HQ we’ve been working hard on an update to pebblecode.com. Now that it’s been released we thought it would be great to talk about the design process as well as explaining the tech involved.

One of the key motivating factors for the redesign was to bring the pebble {code} and pebble.it brands closer together. We’ll be releasing an updated site for our sister company int he future so stay glued to pebbleit.com for updates.

Read More

Share your thoughts with us on twitter

markdurrant

17th March 2014

pebble {code} at Lloyds Innovation jam

Last week, we at pebble {code} had the exciting opportunity to take part in Lloyds bank Innovation Jam. Lloyds is a highly respected banking institution in the UK, and has been a constant on our high streets for 140 years, with over 16 million retail and small business customers.

Read More

Share your thoughts with us on twitter

johnmildinhall

10th March 2014

Innovation != technology

Businesses are increasingly looking to technology to solve a requirement to innovate. Hack days are now the domain of corporations looking to generate ideas and creativity quickly. But for businesses to really embrace innovation cultural change is far more important than technology.

Offer the freedom to play

Within corporations fostering a creative environment can be highly challenging. Typically corporations have processes around everything from installing software to how to enter a building. Creativity cannot flourish when overly constrained by process and regulation. If an employee thinks that an idea will never see the light of day why would they even express it?

For innovation to be given a fighting chance a baseline is that employees are offered the freedom to express themselves, experiment and play. With the concept of experimentation a business should accept the idea that it is ok to fail. Clearly it is not acceptable for innovation to permanently fail but the word experimentation means that it should be expected that not everything will succeed.

Ideas come from anywhere

Too often in corporations a top down culture prevails around innovation. The idea that a senior management layer somehow directs innovation will seldom work. More likely to succeed is the idea that anyone can innovate and that each person within a business will bring something different. If a culture exists where individuals can express themselves freely innovation can flourish. For the senior management layer this means learning to let go of the reins if only in specific areas.

Remove barriers to creativity

As individuals hit barriers their propensity to innovate reduces proportionally. Within the realm of software the time to first commit for a developer is crucial. If someone has an idea they want to start working on it straight away. Developers do not want to go through a lengthy process for installing software or need to fill out forms to get access to a database. The ability to share ideas quickly and the time to get an idea in front of a colleague is also very important. How can innovation happen if it takes two weeks to provision a server to allow a web page to be shared?

For a developer the ability to code and share code instantly has been solved by being able to use PaaS products like Heroku. A developer can instantly push code and get a URL to share with someone else. Tools like Github and npm developers instantly.

For a corporation there may be security considerations but within a corporate firewall there should be no reason that experimentation cannot occur.

Conclusion

Innovation and creativity are not something that you can turn on and off in an organisation. If you really want to embrace creativity the culture and organisation of a business must be carefully considered. An innovative business will be a place where people can freely express themselves and are encouraged to do so. It should remove as many barriers as possible and make it trivial to share ideas. It should accept that experimentation can mean failure and that a top-down approach rarely succeeds. Then and only then real innovation can happen.

Share your thoughts with us on twitter

shapeshed

7th March 2014

pebble {code} @ AstraZeneca Tech Fair

The other week pebble {code} was lucky enough to be invited to the AstraZeneca Tech Fair, in Cambridge.

image

It was a great to be chosen as one of the most exciting and innovative companies in the tech space, sharing the room with great companies like Google, Samsung, Intel, Microsoft and Huddle. There was lots of great tech on display, and we were delighted to have an opportunity to fly the pebble {code} drone!

Read More

Share your thoughts with us on twitter

johnmildinhall

4th March 2014

pebble {code} @ Big DiP 2014

Big data is the buzzword of the times. Yesterday, we were privileged to attend the Big Data in Pharma conference in London. It was a fascinating insight into how the conservative and risk-averse pharmaceutical industry is using the cloud, analytics and a wider range of data sources to speed up the laborious process of getting drugs to market.

Read More

Share your thoughts with us on twitter

johnmildinhall

20th February 2014

Innovation Opportunities in Retail Banking

pebble {code} is a place awash with ideas. We look at traditional industries and see a wealth of opportunities for disruption from technology. We have written a short report on areas within Retail Banking where we see potential for technology to offer consumers better customer experiences.

We see four major areas that will shape the direction of customer experiences in Retail Banking:

The report Innovation Opportunities in Retail Banking is available for free.

Share your thoughts with us on twitter

shapeshed

7th February 2014

Encryption climate shows the value of Open Source

The Snowden revelations have thrown the surveillance climate wide open and some have suggested that the behaviour of the NSA has broken the web’s security model for everyone.

At the 30th Chaos Communication Congress [30c3] Nadia Heninger, djb and Tanja Lange delivered a brilliant talk about The Year in Crypto. Although there are some very technical sections I highly recommend that you watch it.

They cover a lot here.

Where open source wins

In this talk it is clear that Commercial encryption software has become generally less secure in the current climate. The strength of open source encryption is that because it is open source many developers can review the code and find any backdoors that anyone is trying to add.

Better Encryption

The bettercrypto.org site has a paper outlining practical ways to improve the way you use crypto both personally and in the software you create. It has recommendations and configuration for major web servers and best practice for using software.

If you are developing software for the web or value your privacy you should read it.

Share your thoughts with us on twitter

shapeshed

10th January 2014

External Disruption for Tech Innovation

Gate keepers, security, working practises, bureaucracy, legacy, methodologies… These are all really important things that businesses need to train and mould their employees and users to do, but, they all get in the way of innovation, creativity, delivery and progress.

Businesses should outsource their tech innovation problems to smaller, more agile companies (like pebble {code}!). These agile companies have a thirst for new tech, innovation and creativity and can deliver worlds quicker than the in-house guys. This is nothing against the in-house talent, it is just that they are not encouraged to think and do it this way.

Software development should be thought of like science. How do scientists make progress? Trial and error. Why do businesses not do the same? Fear of failure.

At pebble {code}, we take our clients on a voyage of discovery. With our hack days, clients get to put their problems in the ring and have some extremely talented people have a crack at solving those problems. Some work, some don’t, but the whole process is informative, motivating and gets new ideas out there quickly.

If we can create 10 apps in a day, it really does not have to cost you the earth to test different approaches directly with the ultimate users of the software. If you go done the traditional route of specifying everything then you run the risk of ending up with a space craft to search the ocean.

Lesson: failure does not have to cost the earth and/or your job. When done right it is the most positive thing you can do in your software development process, it cultivates ideas and motivates the rest of your in-house team to think differently. It is positive disruption.

Interested? Email us at hello@pebblecode.com to book your hack day

Share your thoughts with us on twitter

thatsinthebook

3rd January 2014

CarolR

The aim of CarolR is to play synchronised, real-time, polyphonic music from an orchestra of devices in the same area, to create an immersive, collaborative, Christmas music experience.

Challenges

In the design of such a system, we had several challenges to overcome:

Given the time constraint of the hack day, we quickly settled on developing a browser-based application as it would allow us to easily run the application on a range of mobile devices without the need for digging into multiple native platform APIs.

The structure of what we wanted to create can be described as a conductor device, who decides what and when notes should be played, and any number of musician devices which each follow the conductor’s lead, emitting notes from their instruments

Illustration of the communication structure

Music Encoding and Programming

We experimented with creating a custom low-bandwidth protocol for sending the instructions from the conductor device to the instrument devices, but decided that harnessing the MIDI protocol was going to have desirable properties, such as:

We found the MIDI.js open source library, which contained two key components for our implementation: programmable MIDI instruments and a MIDI file decoder. The decoder could be run on the conductor’s device to load an existing piece of music, then the notes could be sent to the musician devices which can then play the notes via their instrument.

Using the MIDI Instruments

The MIDI.js library exposed an API which allowed us to:

  1. Initialise an instrument in the browser (loading the sounds required to mimic a specific instrument, handling cross-browser issues)
  2. Start or stop playing a note on that instrument at a specific pitch and volume

Decoding MIDI files

The MIDI.js decoder passes the decoded instructions to methods defined on a generalised interface, where the implementation is chosen depending on the browser being used. To intercept the decoded messages, we created our own implementation of the interface which, rather than executing the instruction locally, can send the MIDI instructions to the musicians.

Communication and Synchronisation

Ultrasonic Broadcasting

Our first line of investigation was to use the sonicnet.js library for ultrasonic networking to deliver instructions from a single device to any devices in audible range. This would allow us to run the orchestra without the need for any GSM or other wireless network.

We managed to get a simple demonstration working with a reduced MIDI protocol allowing us to play a single octave of notes on a single instrument. However, the bandwidth was too low, causing concurrency issues when trying to send too many instructions at once, and limited us to a mono-phonic tune at approximately 60 BPM, essentially one distinct note per second.

Web Sockets

Our backup plan was to use web sockets to send the instructions of which notes to play. We looked at using the SignalR stack as provided by Microsoft, as that was familiar to both of us, however, this seemed like quite a heavy requirement for something that was going to push out a single type of event (MIDI data). We decided in the spirit of a ‘hack’ day, to go with something off our beaten track and settled on Node.js and the excellent socket.io node package.

Bringing It All Together

Having created musician devices that could be sent notes to play via web sockets, a conductor device which can read notes to play from a MIDI file, and set up a node server with socket.io, we had everything in place to start co-ordinating music.

After this we decided for it to be more interesting, and to highlight the fact that it is not all devices starting playback on the same music track at the same time we were going to split the music into individual parts, as defined in the midi files. You could think of it like one device playing the bass line, another playing the melody, etc. It turned out that this was really easy to do, as all we needed to do was filter the playback of the midi notes in the clients by channel. We added a text field and a button to change the channel on the device, and a little Santa gif to give it the famous ‘graphics once over’.

This took as to a little after 5 and it was time for the demo in a short while, so we started asking people to start connecting their devices. A small let-down was that the iPhones seem to have some issues with MIDI.js playback, but this still allowed us to produce a good demo using android phones and our work laptops (which gave us the benefit of better speakers), even if the synchronisation could have done with a little more work.

We are both really impressed with the maturity and ease of use of the whole javascript stack, particularly the Node package manager. We basically got from inception to a deployed audio web app in the course of a working day. Node.js is an awesome technology, and we highly recommend anyone who hasn’t done so yet to go and have a play with it.

It was an awesome hack day, and we were quite proud to come away second place with our little implementation of the distributed device orchestra.

Extensions

Where do we want to go from here? We see a lot of potential in the technologies we’ve put together here, and we hope to get some more time to polish the overall experience as well as looking more into:

  1. BluetoothLE +iBeacon: Relative, location aware grouping/low-level heartbeat sync
  2. Add more instruments to create a richer sound
  3. Integrated visualisations with the sounds being played
  4. Create next-level music immersion
Share your thoughts with us on twitter

danielrbradley

2nd January 2014
W214 Westminster Business Square 1-45 Durham Street London SE11 5JH
+44 (0) 20 3327 3940 hello@pebblecode.com