A good few years ago I hooked up with Garry Paxton who needed some development support for a charity website.  He had created straight-street.com to provide Speech and Language Therapists access to a new and freely available symbol set. Symbols such as this Mulberry symbol set are vitally important for people with communication difficulties – such as an inability to speak. But often, like much in the AT world, proprietary symbols are expensive and so can be out of reach of many who would really benefit form them.

While this work was carried out a few years ago I felt it should be documented and will hopefully inspire others to innovate.

Open symbols

Garry’s goals for the symbols and website included

• Provide an alternative symbol set for older users as available sets were largely aimed at children. This required extra ‘adult’ symbols and a more appropriate style.
• Promote innovation in symbol availability and use by allowing symbols to be freely used, shared, modified and accessed on the web. All symbols sets at the time had proprietary licences and often required a licence per use on a single PC. This was felt to be a serious barrier to users getting free access to critical communication aids they need. Personally I think that the majority of symbol set owners were behind the times as far as the technical possibilities were concerned and so users were missing out.
• Demonstrate how symbols can be accessed in modern web apps through an API. This included providing an API to access symbols, a basic test App and also a protoype symbol chart maker app.
• Provide a strong design workflow for the symbols so they have consistent style (even though permissive licence allows for derived works).
• Encourage community suggestions for and review of symbols.
• Allow easy access to entire symbols set or just a sub set based on criteria such as topic (eg ‘food’)

I think most of these goals were reached by Garry and the team, despite being a little ahead of the curve technically. API usage and general SVG support were nowhere as well developed as they are now. Perhaps most importantly this was disruptive as far as symbol set owners and developers who used them were concerned. We see several web uses of symbols (eg hover over words on commmunicationmatters.org.uk) and a few free or otherwise better licensed symbol sets have become available. Currently the Mulberry symbols are used in many apps (native and web), though some people appear to be abusing the very permissive CC BY-AT licence. Unfortunately Garry’s charity funding dried up and so it was closed at the point the current 3,000 odd symbols were finished. Note to anyone interested in picking up on this – Garry would love to see the symbol development work resume.

To see a fairly random selection of symbols go to  straight-street.com and click on “Search”. You can mouse over the symbols to get a larger preview.

SVG

I loved the symbols and Garry’s aims  in terms of open accessibility so I quickly offered to help fix the website problems. I made several suggestions, in particular using SVG as an alternative to the  WMF (Windows meta format). WMF made sense for use in installed apps as most users had Windows PC programs that only support WMF. It’s scalable but rather crude, requiring considerable hand editing of exports from Adobe Designer (used to create the symbols). In addition, due to security problems Microsoft pulled the explorer support for showing thumb nails, thus reducing their general utility.

I was well aware of the advantages of SVG as a mature scalable format and open standard. I hoped it would soon ‘break’ into mainstream, something that is only just happening now, some 5 years on, largely I suspect as a result of the need for responsive images.

Seeing I was promoting SVG to Garry as the web-friendly format for use on the web I needed to prove it could be easily used in webs apps for symbols. This proved to be basically the case though the test app is a little more complex then expected.

Baker

Briefcase

bath_animal_,_to

Fortunately, that has now changed with improved SVG support in browsers. The biggest breakthrough is the support of SVG files in <img> tags – hurrah! To prove the point, you should be able to see above various the in differing sizes using an <img> tag (and you can click on them for a larger scaled image). These were added to WordPress using the “embed from URL” option without any special effort. Now symbols can easily be displayed in web apps without using awkward markup such as <object type=”image/svg+xml” data=”URL“> and feature testing code.

As an aside, for the straight-street.com site we didn’t use SVG. Rather we used 2 sizes of png (originally giff) for thumbnail and preview images. Plus the user can download zips of all the symbols in WMF, SVG and a size of png. All rather messy.

API

For the API design I researched best practice but found little solid wisdom available at that time. Still, I’m reasonably happy with the design, though no doubt it could be done much better now, especially as we have a good body of experience and examples (though I must say “both good and bad”). At the time, having just read Roy Fielding’s dissertation I was keen to use a self describing discoverable REST style returning JSON with further URLs embedded.  This is perhaps closer to the hypermedia controls approach rather that the alternative metadata formats which seem to be currently slugging it out for dominance (and interestingly I see Microsoft have standardised on Swagger Metadata for Azure as most popular metadata). For our API we only require GET, at least as the API stands, which makes life much simpler in terms of API design and implementation.

Here’s an example request to get all symbols with name or tag containing ‘sweet’

http://straight-street.com/api/symbols/EN/sweet –

The API’s home page straight-street.com/api provides details usage information. And a small interactive test applications is provided at straight-street.com/api/test.html

For implementation I initially used Python which was a joy to write (as always) but as our free hosting only provided CGI is was REALLY slow. I therefore reimplemented it in PHP using a rather obscure light weight MVC framework for routing (DooPHP). This is reasonably fast. When it comes to a rewrite I’d no doubt use node.js + hapi or perhaps Python’s  Flask. In addition JSON Hyper-Schema looks like a good spec and tools to use.

Conclusion

Despite being a little ahead of the accessibility and web curve I think we managed a very reasonable first product implementation. Web support has moved on so far and fast that I’ve no doubt the web site, api and samples apps could be easily recreated and be in much better shape.

We’d love for symbol users to get access to these symbols in a wide range of innovative on-line and web apps. We’d also like to see many more symbols being added to make this a comprehensive set with excellent utility. Perhaps most importantly we’d love to see a community grow around these symbols to ensure sustainability.

We’ve put the Mulberry symbols, the API source and website source on GitHub in the straight-street organisation. I don’t really recommend looking at the website code – it has a strange history 😉

If this resonates with you at all and you have access to funding and/or development time then please do talk to us.