Richard Halford Lead User Experience Designer

Transcription

1 Richard Halford Lead User Experience Designer User Experience Portfolio Mobile: Website:

2 Profile I have been a user experience specialist in various guises for over 11 years, and have been consulting since Over the course of my career, I have gained a range of experience, including interaction and interface design and development, usability evaluation and accessibility, UCD research and methods, rapid simulation and more recently strategy and leadership. I have led a team of User Experience specialists, offering the full spectrum of services to our clients across a wide range of technologies and projects, from mobile to enterprise back end booking systems, using agile delivery methods and delivered as part of both small and large teams. I am a great believer in not only developing my own knowledge, but sharing it with others too through the training courses and knowledge sharing sessions I have run both formally and informally. Some of the great clients, companies and brands I have been privileged to work with

3 Methodology I have followed and adapted the principles and methods of User Centered Design (UCD) since I began as a digital producer. Agile RUP is a blended and powerful methodology and is my favourite way of working. Rapid Simulation is the future for User Experience and something I practice almost daily.

4 Methodology Agile RUP User Centered Design Rapid Visualisation Agile RUP is the most collaborative and powerful project delivery approach I have worked with. It is founded on Scrum, with elements of extreme programming and supported by RUP practices enabling agility, structure and collaboration. But just because you use a great methodology, your project is not guaranteed success. The Crown Office and Thomas Cook were great projects which demonstrated the tremendous value of a collaborative, iterative approach to delivery. To make Agile RUP work, you need the right physical environment, everyone s buy-in and the client bedded in, working as part of the scrum teams working to deliver on each iteration. You can t always get lots of time with end users and sometimes just getting budget for UX design on a project is a great achievement. So a key part of practicing real world UCD is choosing and adapting the right methods and practices to suit both the client, and the realities of the project. From competitor research with end users, persona workshops with the teams that handle customers all day long, to collaborative workshops where the client end user is up at the board drawing and talking, UCD is as much an ethos as it is a methodology. Rapid Visualization is a collaborative, 6 step approach to gathering and validating business and user requirements using rapidly generated interactive simulations. At the heart of it are a series of user scenarios or stories which walk through a series of processes, steps, screens and requirements. In a series of collaborative workshops, stake holders and the project team explore, capture and validate requirements which are iteratively visualized and simulated before each session. I have used this approach on large and small scale projects and as a means of bringing to life the art of the possible. 1 Inputs Personas Interviews Stats Research 2 3 Scenarios Journeys through the system Screens Screens drawn and wireframed on the whiteboard Document 6 Validation 5 Simulation 4 Signed off and agreed requirements for business and users Validated with client and end users together Iteration Screens iteratively built into interactive simulations The 6 step process for Rapid Visualisation

5 Analysis Analysis is a holistic and core aspect of what I do, from interviews with end users in far flung Scottish offices, to business and system analysis for global CMS portals, through to mobile banking competitor analysis.

6 Analysis User Personas Interviews & Expert Reviews These personas were created for the Welsh Assembly RPW Online project. I was asked to perform a usability review of the Crown Prosecution case management and marking system. Given the time and budget constraints I was under, getting out to interview Welsh famers was I observed and interviewed users from each of the key user groups in their workplace. I then not an option. So I ran a workshop with the key front line staff who work with, and support the conducted an expert review, checked my recommendations with the technical team and farmers on a daily basis. Guided by me, we collaboratively built these personas into a key project compiled a report with my findings and recommendations. asset. We thought there were 6 key audiences to start with and came out with 9! Almost immediately we gained greater buy-in from the client team and key stakeholders seeing their teams getting involved and sharing their remarkable knowledge of their customers to build a better and more user focused system. The needs and motivations of the end users, written up by front line staff. What is a persona and how to construct one? User Interview and Observation Notes The final persona Usability report findings and observations

7 Analysis Competitor Analysis Business & Process Analysis In designing the FNB s WAP banking UX and UI, I carried out a detailed competitor analysis across the other major banks mobile offerings. As part of the High Level Design team on Morrisons I analyzed the multichannel, go-to-market proposition and the high level business requirements, against the existing technical platform to assess technical feasibility. By using our bank of test phones and personal phones we explored the features, functionality, messaging, speed and interaction of our competition s WAP solutions, photographing each screen as we went. I then mapped 8 key end-to-end customer journeys, using brown paper and post it notes, through the proposition across each business stream and channel of the target business operating model to stress test the proposition, drive out and validate key business and system requirements, and ensure a seamless and joined-up user experience. I still believe we designed the most intuitive and visually resolved WAP banking solution, but our security and authentication method presented a significant barrier to entry which hampered the growth of our WAP banking solution. Customer Journey mapping key go-to-market propsitions through the full multi-channel life cycle The mobile banking competition including Standard Bank, ABSA and Nedbank. The first of 8 scenario driven process maps taking shape, plotting every proposition touch point across every stream of the business.

8 Information Architecture Whilst working as a Digital Producer in my first digital role, I learned a great deal about structuring information in a findable and clear way whilst working on the new global Coca Cola intranet and whilst developing a community based, legal information and knowledge management system for Matrix Chambers in London.

9 Information Architecture The magic is in the details, and there is always a lot of detail: from humble site maps, through to content audits and all the way up to aligning complex case management screens and use cases to data models. I have always strived to deliver a user experience that is intuitive and inline with the mental models of the end user, ensuring the right language is used and that there is clarity and understanding between all the delivery disciplines, from project managers to developers and testers. Public facing content schema for Matirx Chambers. The large and dynamically complex site map I created for Matrix Chambers to give both the team and client a clear view of the application and the relationships use cases, community management and system administration.

10 Design Designing is what I really love to do: from the first thumbnail sketches as ideas are sparking all around to the final, pixel perfect design on your mobile, ipad or screen, and all the countless hours in-between, honing, testing and iterating again each and every design decision.

11 Design Depute Case Witnesses view for the COPFS Phoenix application, one of over 600 screens I wireframed. Wireframes From paper to digital, from Visio and Axure to clickable interactive HTML, from use case story boards to detailed, annotated wireframe screens, I have produced the appropriate wireframes to suit a range of needs, from portal CMS systems to bespoke rich web applications. Inital storyboard wireframe scamps for an ipad application Initial, hand drawn wireframe with annontations for RPW Online home page Capturing Ideas for scenario process flows, channels and high level requirements on SFA AV 6 Annotated wireframe for Schroders localised fund overview page

12 Design User Interaction, Low & Hi Fidelity Simulations Using tools like irise and Axure and Twitter Bootstrap, interaction design and rapid simulation becomes a joy, enabling you to simulate the user interaction model (which is so much more than a set of static wireframes), and then validate and test it with the user, quickly collaboratively and iteratively. Simulating the complex, state and security driven navigation model for Thomas Cooks Globe booking application meant that simulation was the only way to get it right. You are also able to step outside the bounds of a single interface and start to explore and realize a user s experience across multiple information levels and scenarios like we did with the National Grid - you can start to visualize the art of the possible. Revised navgation model and in page navigation component design for the Thomas Cook Globe project An art-of-the-possible simulation exploring ways to open up the gas network and make it acessable to entire business

13 Design Graphic, Website & Web Application Design My post graduate training was a 2 year diploma in Graphic and Multi Media design, so it is always a pleasure to get stuck into a graphic UI design challenge. I enjoy nothing more than taking a few rough scamps sketched out on a white board or some scrap A4 paper and iterating it through to a design which I can realize as a graphic design in Photoshop or more recently quickly prototype it in a UI framework like Twitter Bootstrap. Wordpress blog theme built for the digital team at Pan Macmillan The Internaltional Society for First World War Studies is a responsive HTML5 site powered by Perch CMS Rutal Payment Wales Online site built using the Java UI Tag library I co-developed with the Twitter Bootstrap Theme

14 Design Mobile App & Responsive Design I have really loved every minute working in mobile, from USSD, SMS and WAP to HTML5 and responsive web apps, to designing and co-developing native iphone and ipad apps. The iphone simulation below was designed and developed in collaboration with our Dutch office to demonstrate our mobile capability. iphonoe app prototype for BOL, a Dutch Amazon e-retailor Prototype iphone banking app Responsive UI developed for the Coach House Confectionery company, optimised for large and medium screens as well as mobile and tablet screens

15 UI Development With experience in developing, accessible, responsive and valid front ends for web and mobile applications in HTML5, CSS, JavaScript, PHP and JSP, I am more than comfortable realizing my designs in working code.

16 UI Development I believe that UI and UX should be technology agnostic, so I am happy to work within any framework or language. I am comfortable working in the views of any MVC framework and in PHP,.Net, xcode (ios) and Java (Struts, Play & Spring). I am also experienced in using code version control repositories like SVN. Perhaps the piece of work I am most proud of is the part I played in developing a themed UI tab library for the Java team. To speed up the delivery of consistent, valid, well formed and accessible front end code, 3 of us built a Java Spring based UI tag library. Using Twitter Bootstrap as a UI theme we created a live style guide which provides working examples for each UI control and element along with the tab and all the attribute parameters as well. We hope to open source this UI tag library soon. The tag library code showing semantic and clean HTML markup I should point out that although I am happy working in complex application code, I am not a developer - its the CSS, HTML, XAML, JavaScript magic that I am interested in. Explanation with the tag and rendered example The live style guide with a working form to demonstrate the user interaction and error messages

17 Leadership & Strategy Having led a team of User Experience consultants and led UI and UX work streams for many projects, I have gained invaluable experience in managing and motivating teams, planning and estimation, stake holder management, and team leadership.

18 Leadership Strategy The challenge in leading a UX team lies in motivating, supporting and developing diverse, intelligent, inquisitive and multi-skilled people with tremendous creative energy who are striving to do great things. And the team is doing all this whilst on difficult projects and in complex commercial scenarios. What I am really interested in is the seamless, frictionless experience across devices, interfaces and channels. For me, simple is better. And no, just because it is new and shiny, it doesn t mean you have to have it right now. A recent article written by Joseph Dickerson 1 on UX Magazine called How to Effectively Manage a UX Design Team reflected my thoughts and experience in a remarkably clear way. These are great topics on which I have many thoughts, too many to include here. Perhaps we can discuss them together? Have a Shared Vision Set a Rigid But Flexible Process Spread the Love Around Listen and Pay Attention Allow for Disagreements, But Don t Let Them Get Personal Don t Compete: Mentor Set Up Peer Designing Credit the Team for Successes, not Yourself Don t Play Favourites Appreciate that People are Different Mentor, Don t Command Allow for Regular Research Time Have Fun! 1 ARTICLE NO. 976 March 13, 2013