Digital Marketing and Comms

We've seen 1s and 0s you wouldn't believe

Topic: Development

Doing things better: relaunching our online Undergraduate Prospectus

  , , , , ,

📥  Communication, Design, Development, Marketing, Team, Tools

BBA-blog
Our current online Undergraduate Prospectus launched back in February, after a year's worth of hard and rewarding work. From that time there were two key aspects of the project that gained us huge successes, which I will be outlining in this post.

Focus Group sessions

Something that we'd started with the redesign of our homepage, we continued and enhanced with the revamp of the prospectus. I cannot understate the value in carrying out this activity. Suspend your cynicism that this is a vapid, marketing focused (well, it is but actually it's more consumer focused) assumption affirming, lip service to finding out your user's needs. This is the only time you gather qualitative data from your target group. Otherwise you're mostly guessing.

I mentioned affirming assumptions. That's actually a good thing. Our Esteemed Designer wasn't sure about the pink highlighter circling around the Apply button, but when we took it to our first focus group at a nearby school we were pleasantly surprised by the enthusiasm and positive reception. This was a group of Gifted and Talented young people in year 12, very much amongst our target demographic. They felt that our colourful design was right for 16-17 year olds and not "dull like other universities, who treat us like we're 30".

The colourful design is right for us as 16-17 year olds and not dull like others, who treat us like we're in our 30s

Another session a few weeks later (this time with around 60 students - a logistical triumph!) repeated this sentiment: that the colours and the pink highlighter on Apply resonated with them.

What's interesting is that we could easily have ditched that design element. Because we didn't feel sure, or our stakeholders in their 40-50s might have objected. The feedback from the focus groups gave us the confidence, and the evidence, that it was The Right Thing To Do.

This was the first time I'd personally been involved in running a focus group and interacted directly with our "clients". Having feedback that what you're doing is good, is deeply rewarding. Since then I've also been involved in running focus group sessions for the School of Management website. I hope to be involved in more of these.

The Play Framework

This point is on the technical implementation of the prospectus, but one worth stating. Up until now we would be using some heavyweight, enterprise level software frameworks to build our systems with: Struts 2, Spring and Hibernate. The very same toolset that blue-chip companies will use. But in being so heavyweight for a small team of developers it means, excuse the pun, a lot of weightlifting to get small things done. For example we would have to do a lot of work on configuration and setup to support the features we want to build. This was a burden that got in the way of achieving the goal of building the actual feature. And would also be hard to maintain.

We had plenty of experience to go by that lead us to this conclusion, like building the previous prospectus with this toolset.

Before starting this project last year we were assessing a new Java web-app development framework called Play. Our first reaction was that it felt a lot like Ruby on Rails, but this is no surprise as Rails espouses "convention over configuration" and Play is simply following good conventions.

The main things we love about Play are:

    The focus we can place on building features compared to our previous working practises
    The plugin system where commonly required features are already implemented which you can (ahem!) plug in.
    But mostly it's the rapid deployment during development.

The traditional workflow for Java requires an intermediary compilation step and you have to sit there while you wait for it to finish. With Play you simply refresh your browser as soon as you've saved your file.

These two aspects of the the online Undergraduate Prospectus project have helped to make it the success it is now. Play made getting something up and running quicker than we have in the past - by allowing us to not burn time on startup costs. Running the focus groups has ensured that we are delivering to our prospective students what they desire and require. Two ingredients we'll be using again in future projects.

Review of browser usage stats

  , , , ,

📥  Development, Tools

I recently thought it would be worth looking at our browser stats to see which browsers people are actually using when they visit our site. When I saw the recent numbers I was a bit surprised and thought it would be worth reviewing the changes over the past few years to find out:

  • Where have we come from?
  • What has changed in the past 3 years?
  • Where are we now?

I also wanted to produce some graphs to display the information visually rather than having lists of numbers in tables.

Show me the graphs

I'm going to jump straight in to the results now, but the details of where the data came from and how I produced these charts is covered later for those who are interested.

What our users were using in July 2008:

Browser Share / % Visits - July 2008

What our users now use (March 2012):

Browser Share / % Visits - March 2012

These 2 charts are massively different! They show how much has changed in the browser market, and consequently in web development, in less than 4 years.

No Chrome, no Opera, no Android to speak of in July 2008 (see disclaimer at the bottom) and Internet Explorer's share has more than halved.

How did we get here?

The change over time from July 2008 to March 2012:

Browser Share / % Visits per month

The same data as above, in a line chart:

Browser Share / % Visits per Month

So we see the steady decline of IE, the rapid growth of Chrome and (to a lesser extent) Safari and the squeeze of Firefox. Opera is the constant tiny fraction and in recent months we see the Android browser appear in the stats.

So what?

I believe it's important to have an understanding of the browsers that people visiting our site are actually using. We can then develop the site to work best for them. That may mean ensuring pages render well in older browsers or being able to use some new technology because our users' browsers support them - either way we can make things better for people visiting the site.

What about IE?

There is one last graph which I find interesting and should help to answer the recurrent question "Which versions of IE should we support?":

Internet Explorer Version Share / % Visits per Month

There appears to be a strong argument to ignore IE6 (finally!) and focus more on IE8 and 9. Unfortunately IE7 doesn't look like it's going away any time soon.

What's next?

There is of course a lot that we can do with the Google Analytics data. I'd like to look at the different versions of all the browsers, filter by country/language/OS and also compare our stats with other websites.

If you have any interesting browser stats for comparison, let me know in the comments.

Getting the data

I wanted browser stats for the last few years so I went straight to Google Analytics (GA), found our profile for external traffic and delved into the numbers.  However, it soon became clear that gathering data for the past few years from the web site would take ages (as I'd need to export data for 45 months individually).

So, I decided to get the data from GA using the API.  After looking around for existing code to help me, I settled on a pure JavaScript solution as a starting point.  This not only grabbed the data from GA but also generated graphs from it using Google Chart Tools.  It seemed perfect!

Or so I thought.  But, as so often is the case, I needed to modify the original code a lot more than I first expected, to get it doing what I wanted.  There were a few issues to overcome, including 414 errors (which were new to me) from the Google Chart API (documented in the FAQs) and the limited dimensions of Google Charts.  A really helpful tool for checking the data coming from GA was the Data Feed Query Explorer.

Once I had tweaked the code, understood the data formats and chosen my chart colours, I was able to get useful output and generate the graphs I've included in this post.


Disclaimer
All data sourced from Google Analytics via the Data API. Values less then 0.5% have been ignored. All data is from external visits to the web site. Graphs were drawn using Google Chart tools and are accurate to 2px. Use caution when interpreting the graphs. Past performance is no guarantee of future success. Lines can go down as well as up.

Going HTML5

  ,

📥  Development

HTML5 logoEdge Hill University recently launched a new website. It's HTML5.

We're overdue an update to the list of which browsers our website officially supports, so here's a quick run down:

IE represents about 50% of all visits to our site (that's visitors from both on- and off-campus). Of those, 75% are IE8, this is followed by IE7 and IE9 in that order. Of our IE6 visits, there are twice as many users in the UK as there are in China.

A quick comparison on caniuse.com shows that by switching to HTML5 we aren't going to use any features which could be used by our biggest audience by percentage, but if we're smart, we can start to target standalone apps which don't necessarily use our main (XHTML 1.0 Transitional) doctype, or have a high percentage of non-IE users, and introduce new features to them using tools like Modernizr.

IE10 Platform Preview 2 has just been released and this does contain some basic HTML5 functionality such as support for some of the new form elements so it's definitely worth getting ready for the future. We'll probably create test areas of our site, not available to the public, which use the new HTML5 features so that when the new browsers come out, we can easily see whether they're yet good enough for our purposes.

Web Developer wanted!

📥  Development

UPDATE: applications are now closed for this position

You're a PHP or Java web developer looking for a challenge, a 6 month contract, and to earn up to 17,823 pounds. As it happens, we've got the perfect opening and you can apply right now!

We're looking for someone with a passion for developing friendly, usable applications to help us revamp the the process our students go through when they apply to study here. Following that, you'll lead the development of an innovative application to help international students get in touch with other students from their home country who may already be here, and to help ease their transition into life in the UK. It could include integration with Facebook, pulling data from their student application, forums, a mobile interface or whatever you see fit, all wrapped up in our brand-new visual identity.

The application form is on go.bath.ac.uk/webjob and you can see our Web Development Manager, Phil Wilson, give a quick overview below:

[flv]http://www.bath.ac.uk/video/jobadvert/webdeveloper.flv[/flv]

The offer closes pretty soon (on Wednesday 27 October) so act now!

Finding people while mobile

📥  Development

As part of our innovation time, I thought it would be interesting to get one of our applications working on a mobile.  Not only would this give me the opportunity to try out some new technologies and develop for a different display device than we generally do from day to day.   It also gave me the chance to play with my new iPhone at work.

Our Person Finder application seemed the logical choice for use on a mobile as phone numbers and email addresses are both things you might need when you are out of the office.

(more…)

Implementing innovation

  , , ,

📥  Development, Tools

A few weeks ago I got the chance to be the first to make use of our innovation time.

After watching a demo on hacks.mozilla.org I wanted to experiment with HTML5 and Firefox's new support for drag and drop of files from your desktop to our web-based file sharing system, the Learning Materials Filestore.

The documentation they provide is nowhere near enough to actually implement this, so I was about to give up when I found out that only two days earlier the people who write TinyMCE had released Plupload, a library for doing exactly what I wanted!

(more…)

Welcome back!

  , , ,

📥  Communication, Development, Team, Tools

So what an exciting first few weeks back we’ve had!

We started off nice and easy, picking up all the support requests that had been filed over the Christmas break and, after a suggestion from Kelvin last year, put together a demo of an augmented reality map of the University campus using Layar (which I will post more about later).

We also started preparing for our next set of work, delivering the most-requested features and fixes to our news publishing service, which is based on WordPress.

The shortlist of work we’d do was created in December during face-to-face meetings with members of the Press Office after which it was published on our wiki using the survey macro to give everyone a chance to vote and comment on which items were most important. At the same time, we got on with estimating all of the listed items so that once voting was complete we’d be able to balance the importance with how long they were going to take!

And then the snow came.
Twitter message about the closed campus

Snow on campusFortunately the University had prepared for this already and an emergency telephone number had been set up with the current status of the campus and there were prepared news articles ready to be published. Of course, yet again the use of Twitter was instrumental in delivering the message that campus was closed as quickly as possible (and at least one person enjoyed their 7.30am tweet delivery!)

Sadly for us in Web Services, there are excellent remote working facilities provided by Computing Services, with a good VPN and remote desktop connection to work PCs and a wake-on-lan facility if your PC is off. There is also an instant messenger server which enables both one-to-one chats and chatrooms for groups of people which enables us to co-ordinate effectively even when we’re at home in our PJs.

The combination of remote desktop provision and web-based tools for documentation and issue-tracking meant we were able to complete the work for the news system on time. Now that the snow's melted we're just waiting for a moment to deploy our changes and show the Press Office what we've done!

First of many...

  

📥  Development, New website

After months of developing, beta testing, feedback and more developing we have launched our research website!

Research is the first of the core sites to be launched as part of the external website project and will be closely followed by study (due for launch in December).

Despite having a research presence before, the site did little to promote the world class research undertaken here at Bath. Unless you drilled down to departments and individual centres and groups our research was difficult to find from our central website. We've also invested a huge amount in a publications repository in recent years but this was invisible to our users.

The new site focusses on exposing this information and promoting it. Led by Web Services we have worked with a number of key stakeholders across the University including our Pro-Vice-Chancellor Research, Jane Millar.

It is the first in a long line of developments and it will evolve over the coming months (and years!) but I am incredibly proud of the team here and what we've achieved.

One down... many, many more to go!

University wiki - Confluence 3.0

  ,

📥  Development

Update: Due to a number of complexities the wiki upgrade has been postponed to Tuesday 29 September between 8am and 9am. Web Services apologise for any convenience this may cause.

Original message below:

The University wiki is due to be upgraded on Friday 25 September 2009. The upgrade will take us to Confluence 3.0 the latest version of the software which has substantially improved performance and a range of new features.

For more information watch the Confluence 3.0 overview video or read the release notes.

Please note the wiki will be unavailable between 8am and 9am on Friday to allow for this upgrade.

The benefits of open formats

  , ,

📥  Communication, Development, Team

As of this time last year, the University Academic Year Charts have been generated in HTML, PDF and iCalendar formats from Excel spreadsheets. Previously there were only PDFs for download but we thought that providing versions to view live on the web and a version people could add to their own calendar software would be useful.

To take the burden out of maintaining all these different formats by hand we used some short Ruby scripts to do this (using libraries such as roo, pdf-writer, and icalendar).

Within Web Services we use the calendar plugin of our wiki to schedule who handles our frontline support on a daily basis (and then get it deliverd to us over instant messenger, as we've blogged about before) but it didn't show the University holidays, meaning that the support was somtimes unfairly balanced.

A screenshot of our support schedule plus University holidays

A screenshot of our support schedule plus University holidays

Yesterday we remembered that one of the year charts we generate just contains dates relevant to staff, without all the teaching days and student holidays marked in, and like all the others, we generate an iCalendar file for it, which the calendar plugin can read. So, a few clicks later and now our support schedule contains the University holiday dates as well as our custom-added events.

This means our calendar has an iCalendar input (the holidays) for human usage when we're updating the schedule as well as an iCalendar output (our support schedule) for robot usage when delivering our schedule directly to us! We've had to do comparatively little to enable this, neither of them have to be maintained by hand, and this is only a tiny fraction of the things that are possible, and all enabled because we use software which generates and consumes standard, open formats (and thanks to Tom Natt for making sure we did it!).