Hello, my name is Craig. User Experience is my thing. Here are some examples of my work.

iLearn@Nestlé

End to end complete rebuilding of Nestlé's global training and learning homepage.

HR Solutions Review

User experience evaluation of the existing Nestlé HR ecosystem.

CSC

Enterprise 2.0 Usage: A CSC Case Study.

Hire to Retire (H2R)

The major part of my work at Nestlé; I was in charge of user experience for the largest HR transformation ever.

Me & User Experience

Information about UX and this site.

Afton Bladet

A university project on the website of a newspaper's web TV player.

International
IDEA

Evaluation of aceproject.org

Rive Rein

Minor involvement in a training and learning project at Nestlé.

Bernicia Railways

A freetime project for a fictional company.

Design Thinking

Various Design Thinking workshops.

Axure Prototypes

Various hard-prototypes made with Axure

Fiori Portals

Minor consulting on a Nestlé intranet site.

X

iLearn@Nestlé

The homepage for the global training & learning system at Nestlé. Based on the Cornerstone On Demand SaaS platform.

First step was research. A series of usability tests with inexperienced users and interviews/contextual inquiries with more experienced users. Ideally this should be conducted in person however to get an international dimension much of it was also conducted over Skype.

Once a write-up of the findings from testing was complete, the next step was to consider a broad variety of redesign alternatives; at this early stage there is no such thing as a bad idea, even the worst ideas may potentially have something that can be recycled within them. A mistake some people often make with wireframes is trying to make even the initial sketches works of art; this is not what wireframes are for! Steadily these ideas were refined and a few alternatives produced with Illustrator that could be presented to stakeholders and discussed.

Whilst this was going on, I was also in contact with developers to actually make the end product. The received quote was enormous. Thus t was decided I should experiment myself and see what I could do within the CSOD system.

Developing within the CSOD SaaS framework proved far more difficult than making a stand-alone website. There are lots of idiosyncrasies to deal with; something not helped when part way through my development the software was updated necessitating large changes in my code. The original plan called for modifying the default widgets and navigation bar however this was beyond my abilities and the intention was to use external developers for this. Utimately stakeholders decided the end result as it stood was good enough.

My final solution was intended to be a glocal one; the same broad design and code base is used for all markets, however there is the option for slight modifications to reflect local needs- primarily in the right hand 'market information box' however also on the left, with some markets needing access to Skillsoft (external training).

ilearn ilearn ilearn ilearn
X

The old iLearn page

ilearn

This screenshot shows the page that was existing previously.

I have added annotations from usability testing to the page.

ilearn ilearn ilearn ilearn
X

Mock-ups

ilearn

A selection of the many mock-ups that were produced; the purpose of mock-ups is to investigate possibilities, not produce end-product-quality images right away.

One of my less favoured designs is included here. Even bad ideas can help with investigating possibilities!

ilearn ilearn ilearn ilearn
X

The final implementation

ilearn

Final site, designed and built by me end to end.

A key challenge lay in trying to get my code to work despite the idiosyncrasies of the CSOD platform.

ilearn ilearn ilearn ilearn
X

HR Solutions Review

Much of my first year at Nestlé was taken up by this project; a comprehensive review of HR Systems in use at Nestlé globally.

For the first few months, covering planning and much of the heuristic evaluation, I was working together with an experienced user experience consultant. For much of the project however I was working alone on the UX side of the project (there was also a more technically focussed side).

There were 4 main activities in this project:

Survey - Covering a representative sample of employees and line managers globally (2000<).   My responsibilities covered writing the survey, sampling the target audience, building the survey on Opinio, and running and analysing the survey. I also assisted with running another survey concurrently; sampling was performed in such a way that we could examine the same markets without contributing to the problem of 'survey overload' which can afflict large companies.

Heuristic Evaluation - Based on a greatly updated version of the "HSS Web Design & Usability Guidelines" (much of which proved very outdated for our purposes), a full heuristic evaluation of each system was performed. Sadly we were only able to complete the evaluation with 2 people per system, more would have been preferable for a more reliable evaluation.

Interviews & Contextual Inquiries - Gathering feedback from as broad a variety of people as possible via in person and remote interviews and visits to their place of work. This helped me to gain perspective on the problems that Nestlé employees face. These interviews formed a principal data source for the creation of my first personas and user journeys for Nestlé.

Usability Testing - The original plan called for performing usability testing of every system. Before I reached this stage however it had become clear that the project was heading in the direction of completely replacing the HRIT ecosystem at Nestlé. As a result the only usability testing conducted in this project was the testing which was used for the iLearn redesign (iLearn being one of the few systems not destined for replacement).

There was no definite end point to this project, rather as results began to appear it gradually morphed into the Hire to Retire project.

main text persona map heuristic eval survey graphs
X

Persona Chart

map of personas

A map of the 5 'blue collar' personas made via a visit to a Nescafé factory.
This work was the basis of the consideration of 'non-connected employees' in Hire to Retire.

main text persona map heuristic eval survey graphs
X

Heuristic evaluation

heuristic eval

Heuristic evaluations are certainly one of the less sexy jobs in UX, yet they present a useful way to get the lay of the land cheaply before going to users.

It is important to remember that heuristic evaluations must always be performed by multiple user experience specialists, the utility of just one person's evaluation is rather limited.

main text persona map heuristic eval survey graphs
X

Survey Respondents

survey

Far from the most interesting discovery from the survey, nonetheless it is one of the few slides of my final report which can be safely shared publicly.

One of our more interesting discoveries was, contrary to our initial expectations, that there was little difference in the navigation methods of those who are new to the company and those who have been at the company for several years.

main text persona map heuristic eval survey graphs
X

Enterprise 2.0 Usage: A CSC Case Study

My Masters thesis project, conducted in 2010 and 2011, involved investigating the C3 'enterprise 2.0' or corporate social media system at CSC, and whether it fulfilled its potential to ‘cross boundaries' and enable collaborative working.

Though such systems are now the norm in many companies, at the time it was still unfamiliar territory, C3, based on Jive software, had only been in place for a two years, and without analytics tools it was not known quite how people were using the Jive collaboration tool that they had been given.

Conclusions included that the system had not yet reached critical mass and that this would be a very difficult thing to achieve in such a closed system where your possible userbase was limited to your employee base. A conclusion which gels with future experience of such systems in other companies.

ilearn ilearn ilearn ilearn
X

Front Page of C3

persona
ilearn ilearn ilearn ilearn
X

User Count

persona

One of the things I looked at was the extent to which the system fit Nielsen's 90-9-1 rule; a starting assumption being that perhaps many users would sign up due to orders from above only to never use the system.

Broadly,looking at the left graph, the system seemed to beat the trend, the number of contributers not being too much lower than the number of pure consumers.

Looking to the extent to which people contribute however 90-9-1 tended to apply more, for instance in number of posts in each blog on the site, as shown in the right hand graph.

ilearn ilearn ilearn ilearn
X

Usage By Age

persona

Though my later studies at Nestlé have tended to find that age matters little (different corporate culture? a case of older age groups just taking longer to adapt?),
there was a stand out contrast in this study with younger people being significantly more likely to use the system.

ilearn ilearn ilearn ilearn
X

Hire to Retire

At time of writing (Feb 2018) my main job is as the User Experience Designer for the Hire to Retire (H2R) HR Transformation project at Nestlé.

A major part of this project has been in the production of personas & user journeys and the research needed to get to this point. Much of this draws from survey data from HR Solutions Review and other surveys- the comments section in such surveys is a gold mine. Interviews and contextual inquiries are also heavily used.

Also part of my responsibilities here is proselytizing for the use of user centred design and design thinking in HR. I have made headway here, using Design Thinking methodology for a key workshop. I also played a key role in the preparation of a key presentation to global HR heads, which was done from a persona-based, user centric POV to great success.

Tracking our SuccessFactors system for usability flaws is another task to be accomplished as part of the project. These issues are identified in a wide variety of ways, such as user feedback, personal discovery, and testing.

Usability Testing has featured heavily in this project. Usability testing was generally organised on a component by component basis. One such usability testing project which I have recently completed called for organising a global evaluation of a key component; this served both to get feedback from beyond Switzerland and for me to train other people in the organisation how to perform usability testing.

A major innovation in this project has been the development of customer experience testing; focus groups ran jointly with representatives of the process and change management to expose them directly to user feedback and attempt to look at the whole solution holistically, taking into account the system, process, and communications.

Given we are working on a SaaS system the way UX feedback is handled has proven an interesting challenge. Sometimes changes can be made to the system, however other times it is beyond our control and must be taken to SAP. In cases where changes cannot be made the discoveries of User Experience Testing feed heavily into change management and training.

This project has also often saw my Axure abilities called into use for non-standard purposes; in producing mobile app mock-ups suitable for presentation.

Unfortunately, due to this being an ongoing project subject to NDAs, more detailed information cannot be published here.

ilearn ilearn ilearn ilearn
X

One of the H2R personas

persona

The key rule of making personas: base them on real employee data!

The 'about' section exists purely to give the feeling of a real rounded person which helps with empathy. The metrics and the text to the right however contain insights from interviews.

The use of metrics allows the persona to be understood and compared to others at a glance. The text to the right meanwhile is very detailed, giving a complete story of the work and problems of an HRBP.

A major use of these personas was in presenting the project to HR managers from around the world.

ilearn ilearn ilearn ilearn
X

Success Factors Homepage

Success Factors screenshot

I was responsible for the theming and configutation of the homepage of our Success Factors instance.

Success Factors being a SaaS system I was very limited in what could be done. I also had to stick to Nestlé brand colours.

A major problem encountered in this configuration was that a colour that fills one purpose in one module might fill a different purpose in another. For instance a header that sits on a dark background in one place might sit on a light background in another.

ilearn ilearn ilearn ilearn
X

Suggested Homepage Improvement

new hp

Theme customisation options on SF are limited.

A key piece of stakeholder feedback to my early configuration attempts was the blandness of the homepage; every single icon looked the same.

Unless graphical icons are used (which has many problems of its own) this is the way things must be however.

An improvement to the homepage configuration would be to add a bit of colour to the tiles. Distinguishing one from another in this minor way would enhance usability as well as appearance.

text blur image ilearn ilearn
X

On User Experience & This Site

This site is a work in progress (which really it shall always be), at current progress is greatly slowed by the bulk of my time being spent on paid work.

This site is designed to be simple.

Good User Experience isn't about beautiful graphic design, nor is it about radically different navigation methods that show off the creator’s coding abilities . These elements, properly used, can certainly contribute to an effective UX, but they are not the core of what UX is.

The key to good user experience lies in research. It is critical that you attempt to understand your intended users and their needs. From this we can figure out how to make a system that allows them to accomplish their goals affectively and efficiently.

This should not of course be taken to mean that every single detail should be intensely researched before any production can begin; the best way to research user needs is often to dive right in; after some basic preliminary research to get to work producing prototypes and then validating these with examples of the intended users.

The key is not to be afraid of failure. Quite surprisingly it can often be the case that negative feedback on a poor design can be so much more useful in telling you what a user actually wants than the feedback that can be gained on a ‘safe’, mediocre design.

I find that a very useful thing to do in the early stages is to produce a myriad of low-fi prototypes; some an actual best-guess of what will work, and others that more experimental and unlikely to be anything like the final design. A key guideline that I always try to keep in mind when interviewing is that most people like to be the expert. Let them talk and share their superior subject knowledge with you, let them tell you why certain parts of a design won't work in their particular situation.

As noted above with my thoughts on user experience, an issue with the idea of a 'portfolio' is that much of my work has been quite heavily focused on research as part of large projects rather than in producing an array of end products. Sadly much of this research also includes confidential data, so over-sharing would be ill-advised. A lot of my work being behind the implementation of SaaS solutions rather than in producing an entirely new product has also placed limits on the amount of typical portfolio-fare end products available.

This version of my homepage was created in February 2018. Given the goal of users on this site is simply to gain a brief understanding of work I have performed, a basic one page grid seems a logical solution.

text borderless ilearn ilearn
X

Borderless Prototype of the Current Site

borderless

In creating this site I was originally thinking to go with a borderless, 'whole page as a giant colourful image' look.
On reflection however, clearly distinguishing elements seemed better for usability.

text borderless 2016 site oldest site
X

2016 Version of the site

2016 site

A parallax one pager with fancy floating images. The menu on the left was something I was very unsure about; the length of the page seemed to suggest a menu was needed but this was a very inefficient use of space.

I eventually realised this demand to scroll to discover was not great for UX and the current design with brief preview images of everything viewable right away was a better way to go.

text borderless 2016 site ilearn
X

What isn't UX

what isn't UX

One of the many slides I use to help educate the unaware on what User Experience is.

A particular mistake many often make is to confuse User Experience Design with Graphic and UI design.

This simple graph shows User Experience as an iceberg, with the highly visible Graphic and UI design work at the top resting on the large amount of less visible UX work beneath the surface.

text borderless 2016 site ilearn
X

Afton Bladet

A usability study from my time at university, contributing to the redesign of the web TV player of one of Sweden's largest newspapers.

Full usability study of the top selling newspaper in Scandinavia's foray into streaming video. Conducted in a usability lab, with its results being used in the redesign of the system.

During my time as a masters student at Uppsala University I was part of a team project to improve the web TV player of aftonbladet.se.

This project took the form of a full lab based usability test. The test contained the following components:
1: Participants perform a number of tasks on the website to determine how easy to is to do certain things and which of the multiple possible routes people tend to follow.
2: A post-test interview to ask about people’s thought processes whilst they were completing the tasks. To help with this several further questions are asked using screenshots and questions such as “Which link would you click to view a video clip about the story?” and then asking which style they preferred.
3: A System Usability Scale (SUS) survey
4: A further follow up interview to gain feedback on the test.

Our test uncovered several pieces of information that were incorporated in the complete redesign of Afton Bladet’s web TV player. For instance we found that people prefer to use thumbnails to navigate and that many buttons are completely ignored.

text afton bladet screen shot cliptext question example
X

Aftonbladet Web TV Screenshot

aftonbladet screenshot

This is a typical screenshot of the system we tested.

The highlighted areas reflect the several possible ways to navigate to a new video, we sought to discover which option users most typically used.

text aftonbladet screen shot cliptext question example
X

Final Report Sample

ilearn

This sample from the final usability testing document refers to the previous screenshot containg highlighted navigation options.

text aftonbladet screen shot cliptext question example
X

After-Test Quiz

ilearn

As well as a standard SUS survey and general questions, our post-test interview also contained a screenshot-based quiz.

text aftonbladet screen shot cliptext question example
X

International IDEA

A team project, evaluating the Ace Project website for International IDEA.

First we interviewed an employee of the project. During this interview we discovered the project's purpose, who they envisioned typical users of the website being and their goals, etc...

After this we decided given the limited resources and time allowed for the project to use Jakob Nielsen's Heuristics as a basis for a heuristic evaluation of what was then the current website and screenshots of a to-be prototype.

Each member of the team conducted an independent evaluation, identifying as many potential issues as possible. A combined list was then compiled and each of the evaluators provided a rating on the severity of the issues. An overall rating was given to each issue from an average of the four team members evaluations.

In the final report annotated screenshots of significant issues were provided.

IDEA text evaluation table example of issue on ace project second example of ace project issue
X

Issue Outline & Ranking System

evaluation table

This image grabs screenshots from two different places in the report.

This report was the first bit of UX project I ever worked on.
Looking back now, I can see some examples of things I would now do differently. The description of some issues isn't the clearest for instance.

IDEA text evaluation table example of issue on ace project second example of ace project issue
X

Example Issue 1

evaluation table

In the appendix we featured some annotated screenshots of some of the larger issues.

In this example standard text was behaving very strangely with a hover-effect for no discernible reason and the default text being hard to read.

IDEA text evaluation table example of issue on ace project second example of ace project issue
X

Example Issue 2

evaluation table

In this issue we felt it very confusing that links were all formatted differently, even where they were in the same menu.

Additionally another issue came from there being too many repeated links across the site, with both a top and a left menu being used. This wasted valuable screen real-estate for no benefit.

IDEA text evaluation table example of issue on ace project second example of ace project issue
X

Railway Project

A project originally started during my time in Japan to teach myself about precision drawing on Illustrator. As the years have gone by I have came back to it several times. The project is basically the Tyne & Wear Metro expanded along realistic lines into a pan-North East network. Oh so gloriously nerdy, but not completely irrelevant to UX. Studying the way different networks draw their maps provides valuable insights into design.

As mentioned the core of this project was the map. Transport maps are an intriguing design challenge. It went through several iterations, the big challenge I had was in Newcastle Central Station where many lines all meet in a very congested area bounded by a east-west river to the south and a east-west line to the north. There was a lot of sketching with paper to work out how this could work.

An 'add-on project' I did for this, was a mock-up of a website for this fictional company. To design the site I thought about the typical needs of someone looking to a railway company's site and looked towards other rail sites for inspiration.

SJ AB (Swedish railways) took a very interesting approach with the route planner dominating their site. An intriguing idea considering this is (I guess) the reason a majority of visits to the site would take place. However, this is perhaps a bit overly minimalist- other popular reasons to visit such a site would be to contact the company, find out about service disruptions and, if such a system exists, to top up your travel card.

The various 'special offer' tiles were included, as in my experience, stake-holders often do levy requirements to have spaces for content such as this. Again, if this was a real project these would be investigated thoroughly.

If this was a real project rather than simply something I have made in my free time, then the approach would have been rather different. User research would have lie at the core of the design, it would be a grievous error for a designer to just assume they are right without first checking with users.
I was somewhat able to bring user input into my map- requesting feedback online and checking if people understood the meaning of everything. I made several big changes to my design due to these ad-hoc checks.

ilearn ilearn ilearn ilearn
X

Axure Mock-up

rail site

A simple Axure mock-up of a front page.

This was a casual project, with the goal of improving my Illustrator skills and indulging in my (ultra nerdy) interest in maps, and not directly UX related.

I decided whilst the project was in my mind that it presented a good opportunity to get some practice producing a high-res mock-up on Axure.

In hindsight the text boxes on top of the images should have a darker background as the images have made readability quite poor.

rail site ilearn ilearn ilearn
X

Snapshot of my map

snapshot of map

There really is something that appeals to me bout metro maps. Alas there is not enough space here to discuss them. Making simplicity of complexity perhaps?

At times I have gotten quite into this project. The section depicted here is the most complicated part of my map, envisioning a separate HS rail station in the area of the current Arena that is connected to the mainline and metro stations at Central (themselves two separate but connected stations) via both rail and lengthy walkways.

text about BR bernician rails site map snapshot working sketch
X

Development sketches

working sketch

This very ugly page presents some random snippets from my map development thought process; how to display the busy area around Central Station where multiple lines converge at multiple stations was a big challenge.

Another key question in the design was in the best way to represent stations. The red lines show a few possible alternatives of this.

ilearn ilearn ilearn ilearn
X

About me

Craig Tallentire

I originally come from County Durham in the UK.

My academic background is in Human Computer Interaction.

I have also lived in:

The Netherlands- 6 months
Sweden- 2 years
Japan- 3 years
Switzerland- 3.5 years

I have traveled to, as of 21/02/18: 30 countries

I like football. I support Sunderland AFC. As of 21/02/18 this is not a pleasant experience.

I like history and science fiction. I have never actually travelled in time nor space myself. These areas of study, together with travel, offer great insights into people and design.

日本が大好きな人だです。

You can see my CV by clicking here.

If you wish, you can contact me at c.tallentire@gmail.com.

X

Design Thinking

As a part of my Nestlé I've gained experience in Design Thinking metholodgy on both the participant and preparation & coaching side of workshops.

This section is incomplete....

text for DT persona idea graveyard SAP scenes
X

Design Thinking Persona

ilearn
text for DT persona idea graveyard SAP scenes
X

The Idea Graveyard

graveyard
text for DT persona idea graveyard SAP scenes
X

Mock-up using SAP Scenes

sap scenes
text for DT persona idea graveyard SAP scenes
X

Digitising Rive Rein

This was one of the first projects I was faced with at Nestlé, I recall first encountering it even during my interview.

The "Rive Rein Virtual Campus" was being developed as an add-on to the Nestlé's CSOD-based training and learning system as part of a broader project to modernise the Rive Rein corporate training centre.

The design and development was already done when I got involved with the project, leaving me to perform usability testing.

I was asked to produce some mock-ups of potential improvements, however none of these were ever implemented with the technical limitations of CSOD being the primary factor in the decision not to go ahead with this pilot.

Rive Rein main Rive Rein paint sketch Rive Rein first sketch Rive Rein final sketch
X

A First Rough Sketch

Rive Rein paint sketch

A first mock-up made with the ultra-professional... ms paint.

It took some time after starting work at this company to get more powerful tools installed. Whilst I waited I made do with what I had and embraced the nature of the tool to make a rather silly looking mock-up.

Despite its amateur appearance...it worked. There should be no shame over such basic mock-ups, they aren't meant to be works of art. Mock-ups are solely meant for early sharing of ideas and rapid feedback.

Rive Rein main Rive Rein paint sketch Rive Rein first sketch Rive Rein final sketch
X

A neater and more presentable sketch made using Axure.

Rive Rein first sketch
Rive Rein main Rive Rein paint sketch Rive Rein first sketch Rive Rein final sketch
X

Another mock-up, somewhat better polished however the lack of access to Photoshop at the time shows.

Rive Rein first sketch
Rive Rein main Rive Rein paint sketch Rive Rein first sketch Rive Rein final sketch
X

Fiori Portals

During my time at Nestlé the company transitioned its SAP setup to the new Fiori portal technology.

Not long after the beginning of this project a small workshop was held involving the team responsible for configuring this system, myself as user experience designer, and an external UI developer.

Prior to this workshop I had performed some small ad-hoc tests with representative users and the existing default system.

Many of my suggestions for the system were taken into account as the project went forward with a separate team whilst I had to spend my time on other projects.

Fiori main As-is Coloured zones
X

The 'as-is' as it was. Out of the box Fiori Portal.

Rive Rein first sketch
Fiori main As-is Coloured zones
X

A suggested improvement.

Rive Rein first sketch
Fiori main As-is Coloured zones
X

Axure Mock-ups

During my time at Nestlé I've been called upon to make Axure mock-ups on many occasions. After a demonstration of the capabilities of the tool people soon began to look to me to produce demo versions of systems for use in presentations.

This came where the real system was not yet working and for mobile systems where linking up a mobile to a projector would require sourcing additional equipment.

This is not exactly the intended use of Axure, it being meant more for the producing of mock-ups of new systems before investing in development, and I did use it for this purpose on occasion. Usually however the way Nestlé's development process works meant the niche for hard-prototypes was small, nonetheless I have developed these skills at every opportunity.

text for DT Mobile prototypes CEB Neuron mock-up Me@Nestle mobile mock-up
X

SF Mobile Mock-up

Rive Rein first sketch

During the H2R project I was asked to create many clickable mock-ups of the mobile system for demonstration purposes.

In this one, used for presentation to HR & Market heads, we are demonstrating the flow of a process between a manager (blue) and an employee (red). This setup with two windows and two prototypes allowed for a very effective presentation.

text for DT Mobile prototypes CEB Neuron mock-up Me@Nestle mobile mock-up
X

CEB TalentNeuron Mock-up

TalentNeuron Mock-up

Here is a screenshot from an exercise where I was requested to make a clickable prototype of a system I'd never seen in action for a demonstration to HR heads.

The prototype was to fit into our standard scenario of the Malaysia & Singapore market, and it was built based on US-market screenshots of the system.

The prototype was able to fit seamlessly into the demo with the audience not realising it wasn't a working system.

text for DT Mobile prototypes CEB Neuron mock-up Me@Nestle mobile mock-up
X

Me@Nestle mock-up

me@nestle mock-up

Me@Nestlé with its distinctive orange branding is a key part of Nestlé's intranet.

Designed and launched before I joined the company, a key problem stands with Me@Nestlé it relies on hover-menus thus is incompatible with touch-screen systems.

As part of a project looking at mobile access to Nestlé systems, a simple mock-up was made in Axure of a tablet-friendly version. The prototype is graphically basic, its intention being to
1: Show a viable alternative navigation system.
2: Remove links to items that are themselves not mobile-compatible.

text for DT Mobile prototypes CEB Neuron mock-up Me@Nestle mobile mock-up