Our services for you as a Government Agency

In May 2017 Osynlig joined the New Zealand government web service panel (WSP) as a preferred supplier of User experience design services. To the panel, we bring over ten years experience in helping government agencies innovate and improve the customer experience across all of their digital services.

What is the web service panel?

The Web Services Panel is an all-of-government approved panel for developing websites and applications. It replaces and enhances the previous Common Web Services Panel.

The Department of Internal Affairs has contracted the vendors to provide web services within 11 categories to government agencies after a panel refresh late last year.

Panel procurement allows the 300 participating agencies to cut procurement costs by purchasing services without the need for a full tender. This means Osynlig can be engaged quickly and without primary procurement processes, allowing government agencies to save time and money.

Osynlig is approved in the following categories:
1. Information Architecture
2. User Insight
3. Visual Design (UX Design)
4. Front-end Development

Read more about the panel and how to use our services at https://www.ict.govt.nz/services/show/WSP

Have any questions about our services?
Send them to fredrik@osynlig.nz

 

1. Information architecture

Content inventories

We have many different ways of conducting content inventories. On large-scale projects with large sitemaps and thousands of pages, we use the help of data to filter and label content. This allows us to label different content based on page visits, page session duration, bounce rates and other important metrics that will help to define a visual map of what content we need to alter, add or delete to improve the information structure and site content.

On smaller websites, we perform a standard Google Analytics analysis to define potential problems, dead-ends and bottlenecks within the information structure.

Information sorting

To help with organising and labelling web sites we arrange different card sorting exercises together with stakeholders and target group representatives. We have experience conducting larger content sorting exercises via online tools to identify broader patterns of content groups within an organisation, but we’ve found that the most effective and best way is to organise and label content is to conduct workshops with focus groups consisting of relevant users from each segment.

The results from these workshops can also help defining specific tags that should be set up for content creators to ensure searchability of specific content is consistent across the website.

Sitemaps

In every web project, a flexible, scalable and shareable sitemap helps the team visualise the bigger picture of what is being developed. We have several ways of creating sitemaps, these methods usually include real users to help us create information structures that are easy to navigate.

We have experience conducting larger sorting exercises via online tools to identify broader patterns of grouping content within an organisation, but we’ve found that the most effective and best way is to conduct content sorting workshops with focus groups consisting of relevant users each area that we’re looking to improve.

Creating and validating user stories

We ensure to define all target groups that will be affected by the project or feature we’re creating. These target groups are defined in workshops together with the stakeholders of the project. If research into user needs, wants and behaviours have been undertaken before our involvement the project we use these insights to create user stories that will inform our decision making.

In areas or groups that we feel more insights would be required, we can arrange surveys, live observation and interviews with users to gather more insights to help to build informative and validated user stories.

Wireframes

As part of our user-centered design process, we craft and develop low fidelity prototypes that we can validate with real users and stakeholders. These wireframes can also be annotated to serve as material that will inform the development team on functionality and or interaction that needs to be scoped for the feature. We combine special tools and templates to create low-fidelity wireframes to test different versions fast and efficient.

Clickable prototypes

To help with annotation and to create clickable user journeys, we upload our prototypes online to a platform that is shareable with our clients. With our prototypes securely stored in the cloud, we can quickly share, user test and receive stakeholder feedback directly on the wireframes. This helps with the dialogue and also gives everyone in the project an early visual understanding of what we are creating together.

Web analytics

In projects where there’s already an active service, we always request access to perform a data analysis to define potential problems, dead-ends and bottlenecks within the service. We have experience in defining, setting up and analysing measurable goals within web analytics services such as Google Analytics using methods like conversion goals, event tracking and advanced filtering.

2. User Insight

Understanding the users

We call the first part of our user-centered design process – Understanding the users. During this crucial discovery phase, we try and get as much insight as possible into the target groups, this includes their user goals, user needs, user wants, user behaviour and the context that led them on their user journey. We have several methods that we use to collect data and insights from users.

Interviews and surveys

We have experience in formulating, capturing and evaluating user surveys either via face-to-face interviews or online forms, depending on the scale of a project, service, target group or organisation.
Interviews and surveys are particularly good at capturing user goals, user needs, and user wants. But usually, gives little context and behaviour insights.

Live observation studies

To collect emotional, contextual and behaviour insights we usually do live observation studies. These studies can, for instance, be listening in on a couple of customer support conversation or sales calls with a staff member, or it can be a session where we observe how someone uses a system/feature/website/web application. During these sessions, we ask the user to think out loud about what they’re doing, explain to us and describe how and why they go about their tasks in a certain way.

If we have total control of the observation study we can also record both the screen and facial expressions via webcam to gain more insight into how users are feeling while going through a user journey.

Focus groups

Sometimes holding workshops with focus groups that represent the prioritised target groups is a good way of discovering user needs, wants and can be a really effective way of innovating new and usable features or content for a project. At Osynlig we have the experience of planning, running and documenting focus group workshops that will help inform our design process and final service delivery.

Data-driven insights

In projects where there’s already an active service, we always request access to perform a data analysis to gain user insights based on usage. During this analysis, we look at different user journeys, exit rates, bounce rates, goal conversion and event tracking to name a few metrics that can help us gain insight into the user experience.

We have experience in defining, setting up and analysing measurable goals within web analytics services such as Google Analytics using methods like conversion goals, event tracking and advanced filtering.

User goals

All the user insights that we gather are translated into user stories to help formalise defined user needs, and user goals. We usually work together with the project group in workshops to define these user stories and map them to our target groups. This will help the project prioritise what features/content that we need to create based on who is most important for the success of the project.

To be successful, it is important that we can see how a user story connects all the way back to the overall goals and vision of the project.

Customer journey mapping

How does a customer’s path to reach their goal look like? How do they engage with you? Where do they interact? Are there any gaps in the journey? And where does their path intersect with your business goals? Mapping out the customer journey gives the project a bird’s eye view of the whole process, it maps out the engagement points, the interaction points and can identify gaps or painful processes in the customer experience.

Our customer journeys are usually created in workshops with stakeholders where we use insights, data and our shared knowledge to form a good understanding of the customer journey.

Service design

How we approach our design process depends on the type of project, but it is always informed by user insights that we have acquired earlier in the process. When we’re building a new service/website/application, our design process usually starts with a concept, how do we want our users to feel? What is the tone of voice? What kind of service are we creating? Do we have any brand guidelines we need to follow? By starting to answer all of these questions we create a mood board, a design persona and an overall look and feel of the service.

Innovation & validating ideas

We can also arrange design collaboration sessions to innovate new features or to define low fidelity prototypes that we want to validate with the team, stakeholders and real users before we start the visual design.

Clickable prototypes are shared with the team to get feedback and validated with test users to make sure the interaction is easy to understand and use. An example could be that we create three different main navigation systems and then do some rapid user testing to see which menu gets the best response in terms of usability and task completion.

User-centered design delivery

Each feature, page template, section and function are broken down into smaller separate tasks to ensure a smooth and constant delivery of assets to the development team. As part of our design delivery, we usually create style guides & design framework that can be used as a foundation for further development. These style guides & design framework hold to most common used visual elements like for example forms, buttons, navigation, font sizes, grids, modal windows, avatars, and icons to name a few components.

We have experience delivering design assets for in-house development teams as well as to our own front-end development team and we always establish an agreement on how assets should be delivered before starting any design work. User-centered design means that in the centre of our process we have the users and their needs. This means that every design decision we make is based on our insights about the users.

Personas

Personas give the team visual of who they are trying to help and can be an important part of understanding the users. Our Persona development is based on collecting data and insights about each target group together to bring our users to life with personas that have feelings, behaviours, and aspirations. These personas are primarily used within the project team to validate that everything we do is always with our users in mind.

Usability and UX testing

Before we start testing we define what metrics are important to your product/service. We follow the HEART model that suggests five key areas Happiness, Engagement, Adoption, Retention, and Task completion. By defining which of these areas are most important for a successful project outcome, we can then start looking at what type of signals and metrics we should be testing for.

A big part of testing is planning and preparing the tests to ensure we are capturing the right metrics. By defining user testing goals we establish a clear level of acceptance that will reduce the chance of usability issues later in the process.

Documenting test results
Each test is evaluated by our UX Specialists and a report is written that outlines the test results, specific insights and suggestions on how to improve the user experience to feedback to the design team and stakeholders.

Flexible and affordable user testing
By using a modern cloud-based technology we make user testing affordable and effective as we don’t require a physical testing lab. We can facilitate user testing session in almost any normal office space where there is a private room/meeting room. Our tools are online based and can be accessed via most computers and phones with an internet connection.

3. Visual design (UX Design)

User experience design

At Osynlig we have 10 years experience in delivering award-winning digital design solution. Over the years we have helped our of clients monetize on their digital presence by providing high-quality creative design solutions. Our experience and competence in designing digital services include corporate websites, intranets, city council web sites, web applications, public e-services, e-commerce, creative promotional websites, microsites, interactive touch table apps, native apps, mobile games and interactive documentaries.

All our designers are digital-born and bred with relevant design school backgrounds and have several years of experience in Osynlig’s design principles.

Simplicity. Innovation. Passion - Our design principles

Simplicity as in making everything we design easy to understand and use. Innovation as in always challenge the expected to find new value. Passion as in standing up for the users, creating solutions that people love and that makes us proud.

We believe that even the most complex solution can be simplified with the right approach. In fact, we are experts in turning complex problems into simple and beautiful services for our customers. It is all about simplicity if you ask us. That is why our Simplicity model reminds us every day: Can we make this even more simple for people? As long as the answer is yes, we amend.

Best practice design standards

We follow the latest best practice design standards and make sure that everything we design follows W3C Global standards ensuring usability, accessibility, contrast and interaction recommendations are followed.

Our design team share resources, insights and knowledge in regular design panel meetings to refine our design methods, how we use software and execute designs.

As a standard practice, our designers create dynamic design assets that can be used in multiple instances across a project. This makes updating larger design projects easier and allows us to provide a flexible and effective design process to our clients.

User interface design (UI)

Osynlig is experts in delivering Interface design and we know the difference a good interface design can provide a service. As part of our design-delivery, we usually create style guides & design frameworks that hold interface design elements that can be used as a foundation for further development. Holding together the overall Interface design also improves the overall user experience as it will establish an interaction pattern that users can easily navigate without having to think twice.

These style guides & design framework hold to most common used visual elements like for example forms, buttons, navigation, font sizes, grids, modal windows, avatars, and icons to name a few components.

Animation - your digital body language

An important part of the user experience is how interaction and animation feel, to us it is the body language of the service or product we’re building. How buttons react, menus animate or forms validate is all part of creating a great user experience.

Bridging the gap between design and development

Our designers are all familiar with HTML, CSS and Javascript, that gives them a good understanding of what can and can’t be done depending on technical restrictions, platform restrictions and or hardware. We always try to work closely with the development team to bridge the gap between designers and developers, we believe that the most effective team is a team that can collaborate across disciplines.

We have experience delivering design assets for in-house development teams as well as to our own front-end development team and we always establish an agreement on how assets should be delivered before starting any design work.

4. Front-end development

Accessible front-end code

Osynlig has extensive practical experience and track-record of delivering front-end development solutions that follow W3C Usability and Accessibility Guidelines. All our developers adhere to our technical procedures that dictate mark-up, development environments, versioning, documentation, and test and quality assurance. We have over the years developed our own front-end boilerplates that enable us to quickly set up a new project with the scripting languages required for that specific project.

Mobile-first

All our front-end development are mobile-first and built using responsive media queries to cater for the numerous of different resolutions on smartphones, tablets, desktop computers, Smart TV and multi touch displays on the market.

Front-end frameworks

We have the experience of building front-end frameworks from scratch for clients as well as using popular standard frameworks like Bootstrap. As part of our front-end delivery, we can manage and deliver a Style guide with code snippets and examples.

Our preferred frameworks
Our team has Extensive Experience in using HTML5, CSS3, JavaScript to create mobile-first responsive solutions, UI-frameworks like Bootstrap, Angular Material and Foundation, Javascript frameworks such as jQuery, Meteor.js, AngularJS or React.js, PHP (We use WordPress and Laravel frequently), SQL, MySQL/MariaDB, Version tracking code (GIT, Bitbucket), WCAG AA+, Build scripts (Gulp) and integrating external API’s like AWS, Facebook, Ubiquity, Spike, and Flo2cash.

SEO friendly code

Basic search engine optimisation is fundamental and essential and we follow the latest SEO code recommendations from major SEO companies like Google. We ensure our code-base is optimised for SEO using the recommended Tags for Google Tag Manager. At Osynlig we use tools like Google Page Speed Insights to validate and refine our front-end deliveries.

Get in touch