Wireframes

Make wireframes and/or voice command flow

Within this stage we create a testable design based on a thorough understadning of users’ expectations and ''to-be'' user journey. Sketching, wireframes and/or voice command flow will help you ensure your service reflects your users’ needs. It is a reprsentation of a realistic form and functional service.

GovStack design patterns

Wireframes and/or voice command flow enable direct examination of a design concept’s viability with users. It is helpful for gaining feedback on users’ intentions and various design elements and observing users' interaction with the product.

The following are the wireframes developed for the Extended Producer Responsibility service in Rwan

Activities / Resources

• Create a preliminary version of the service using wireframes and/or voice command flow. A good wireframe and/or voice command flow requires:

  • Using UX/UI guidelines build preliminary Lo-Fi wireframes and/or voice command flow that show structure, placement, and hierarchy for your service.

  • Steering clear of font choices, color, or other elements that would distract both the researcher and the reviewer. Lightweight designs are conceptually easier to reconfigure. Use this opportunity to start listing what UX/UI patterns you will need.

  • Reviewing wireframes and/or voice command flows according to the specific 'To-be' user journey to ensure users accomplish their goals and their needs are met.

  • Using the wireframes and/or voice command flow to get the team’s feedback on feasibility and structure.

  • Using wireframes and/or voice command flow as a way of safely trying out more radical ideas.

• Refer to resources and tools shared by Gov.uk.

• Give the wireframes and/or voice command flow to the user (Citizen/public servant/business) and public official user to observe their interactions without instruction. Ask users to perform a specific task.

• Ask clarifying questions about why they do what they do. Let the user’s behavior guide the questions you ask. It can be helpful to have them narrate their thought process as they go along.

• Iterate! Wireframes and/or voice command flow should be quick and painless to create, and even more quick and painless to discard.

• Get service owner approval to proceed with the functional prototype

Responsabilities

Who does what:

• Service designers/ Design lead – Lead the activities within the 'Activities' Tab.

• User needs researchers – Prepare & apply user interviews, and facilitate wireframe validation workshops with focus groups.
• Legal policy officer– Clarify regulations that apply to the service.

• UX/UI Designers - Prepare the wireframes and iterate them as per user feedback.
• Product/Tech experts - Participate in the iteration session with users to see the reaction to the wireframes.

Deliverables

• Wireframes and/or voice command flow

• Apply the country's digital service design standards. These include standards for:

  • Service information sheet

  • Downloadable forms

  • Web forms

  • Electronic documents

  • Notifications

  • Performance analytics

  • Citizen satisfaction survey

  • Accessibility