documentation

"Documentation helpsUX designers communicate with various stakeholders and teams, document work, and provide artifacts for meetings and ideation sessions."

"A set of deliverables to help facilitate communication, document work and provide artifacts."

— Miklos Philips

"UX documentation has to be actionable and provide practical guidance not just for the design team, but for everyone else involved in the development of the product. To achieve this, UX designers need to document their projects from start to finish i.e. from the research phase all the way to product deployment."

 

#UX Deliverables
PHASES

Defining user-centered design

The 6 phases for designing great user experiences are based upon a user-centered design process: Planning, Design, Production, Deployment, Launch. and Maintenance.

Planning
Setting the "core team" - becoming the "integrated team"
Because each project is unique, it is a important to build a custom-tailored "core team". A "core team" is based on a client individual project requirements and goals, working with a developed network of consultants, producing effective results on schedule and within budget. 
It is vital to remember that the "the core team " is there to help the client succeed. It focus lies in human connection and the practice of sharing valuable messages amongst people. Working together in partnership with the clients toward common goals in a cooperative manner of mutual respect and shared communication is the common goal.

Once the project is running, the clients become part of the "extended team" and together with the "core team," they merge and become the "integrated team."


Researching, brainstorming, analyzing and understanding
Clear and effective communication in a competitive marketplace starts with a fundamental understanding of the client business corporation and its organization, its needs and goals, as well as its target audience(s). All key members of the "core team" will immerse themselves in the projects. This time is used to fully understand the clients; ensuring that the "core team" knows exactly how it envisages the projects to be working and what they wish to achieve with them. More, the core team familiarizes itselves with any systems already in place. In order to maximize the skills and experience available within a multi-disciplinary team and within the client organization, the "integrated team" begins any project with a period of research, brainstorming, understanding and analysis. This process is often highly educational and challenging for both of us - the "core team" and the "extended team".We   with a review of the business plan(s) and the strategies of the organization.

To define the concept behind the business plan(s) and the strategies of the organization, we focus on the ways in which potential users will interact with and perceive any solution we design. We do this by exploring and establishing an initial communication strategy, creating a focused message and building visual iteration solutions which will define (or redefine) the company's individual "voice" or corporate brand. We do not focus on computer systems but on how these systems can be integrated into human activity. Use case scenarios help the team to define off-line activity and to shape on-line behavior. By focusing on interaction with the system, we can design environments that anticipate human needs. When goals are identified up front, usability becomes inherent.

This process will allow us to define the direction of the solution(s) and the future deliverables.


Defining, clarifying, evaluating and establishing
After we spent time digging, brainstorming, analyzing and learning, we collect all the data that we have gathered and begin defining, clarifying, establishing the next steps. The on-line environment is slowly being defined, clarified, evaluated and established. This data gathering is accomplished through a sequence of workshops between the "extended" and the "core" team.

As an "integrated team," we solve problems and find great solutions. We decide on the right delivery method and point out the risk factors, we identify the target audience and its need. We prepare the ground for designing the digital environment, shaping and reshaping a plan that works well, determining the base for the brand, the metaphor, the personality, the style, the voice and the content. We come to consensus to chose the appropriate technology - matching it with the audience.


Building consensus
This phase provides the foundation upon which the design of the site can be built and ensures that the necessary up-front "legwork" has been accomplished. A key output of Discover is consensus between the "extended team" and the "core team" on expectations, goals, standards and delivery approach.


knowledge transfer
The Planning phase includes the following deliverables:

  • Marketing research document

  • Competition analysis

  • Plan site features and content plan

  • Plan site architecture and site map

  • Strategic brief

  • Branding brief

  • Creative brief

  • Architecture brief

  • Develop technical documents

  • Develop and approve the final schedule and estimate

 

Design

Once the strategic planning has been approved and signed off, the design phase is entered. A lot more of brainstorming happens, and the "core team" work closely together with the "extended team."

Successful design of an effective web solution with an outstanding user experience involves a multi-step process focusing on ten key structural elements: e-strategy, e-branding, e-marketing, web usability, information architecture, user interface, prototyping, usability testing, content strategy and technical architecture. Other key design considerations include support and maintenance requirements, QA, hardware/server/database impacts, and security solutions.

 


Setting the design phase

Because we have understood and defined the ways in which a user will interact with and perceive the project, the team is now in a strong position to establish the setting for the design phase - i.e. the digital environment.

 


Building the user experience

This second phase involves the visual creation of the brand, usability studies, content strategies and technical architecture. The different elements within this phase are encapsulated in the term of digital/visual communication design. At this point, we have established the ingredients that will help the "core team" to create an outstanding user experience. The "extended team" is routinely and intimately involved throughout this process. At the end of this phase, we produce designs addressing all identified requirements.

 


UX design

It focuses in gathering and collecting important data from focus groups. These focus groups are the client's target audience. The "core team" identifies human factors susceptible to increase the general appeal, usability and trustworthiness of a web site. The objective is to develop and validate a user/consumer-centered analysis and design method for e-commerce systems and/or e-business solutions. In order to test the audience, we set up a testing lab in house - preferably. The ultimate goal for UX design is to provide enough information for the "core team" to be successful in creating a web site/user interface that attract consumers, make them repeat users, establish trust, make them buy and, most importantly, make them come back.

 


UX Strategy 

In order for the clients to compete and succeed, the "core team" works closely with the "extended team" to finalize the strategy initiatives. Based on these initiatives, the "core team" focuses in developing e-business strategy that will enhance and support the overall business goals of the client. In doing so, the "core team" helps the client to define an integrated business and I/T strategy solution that will position their e-business toward success in the long-term.

At the end of the e-strategy design, the "core team" will provide the foundation for the client's business to move ahead on a well-defined blue print. This defined blue-print is translated into feature definitions, functional specifications and visual models. The overall strategic direction and vision of the project is completely flashed out. At this point, we have defined the site functionality, navigation, and interaction, analyzing and developing user tasks, and usage scenarios.

 


Information architecture design

Based on the blueprint documentation the "core team" is responsible for integrating design concepts and back-end technology. The "core team" reviews and makes recommendations for the integration of new technologies, resolves any integration issues, designs flow boards, provides indexing and organizational schemes for QA, evaluates asset management (admin) and change management.

 


Interface Design - Building the Design Systems

The conceptual approach to the "look and feel" and navigation scheme of the site is also determined at this point. We now focus on visualization and realization, having established brand values through perception and interaction workshops. Identities are created to demonstrate how the brand is to be communicated off line as well as on line. Small-scale models may be used to demonstrate innovative user interaction with the brand.

 


Prototyping

Taking from what we learned from the story-boarding exercise, we can now mock up the interface using navigational elements, text, and images. These exercises identify user goals and ensure that the user will be successful in achieving them; they also ensure that activities will be performed easily and in line with the brand experience.

 


Usability testing

Several rounds of usability testing are performed during the design phase. These tests includes focus groups, formal observational sessions which are conducted in usability lab, and developed test questions which target several major areas such as: placement of navigation and informational icons on pages, terminology used for navigation and site locations, and movement through the web site. All comments are gathered from feedback and used to enhance or confirm branding effort, voice and content, information architecture, visual cues, fulfilment, and the business strategy model. These results will help refine the working prototype and improve it prior its implementation.

 


Content design

At this point, the "core team" develop a thorough understanding of the client's audiences, business objectives, brand strategy, and publishing environment. They establish the voice and tone of the site. They develop processes and tools to help clients create, maintain, and update their content.

 


Technical architecture design

High-level features identified during the discovery phase provide a starting point from which to begin design of the technical architecture. Increasingly detailed views of the system will then indicate sub-systems, software modules and the networking and hosting requirements for the project. Where appropriate, the architecture will make use of best-of-breed technologies. Guided by the interactive and usability design documentation, the "core team" will create a detailed technical architecture design of the web site. Once complete, the HTML templates, graphical elements, and custom code modules needed to implement the high level design is initiated. Typically the "core team" work closely with the "extended team" in an interactive and collaborative manner to create such solution elements as graphical elements design and database schema development.

Standards for HTML features, graphics, database connectivity and dynamic report generation are agreed upon during this phase to ensure that users in the client's target audience will be able to effectively view and navigate the site depending upon the devices / systems and browsers used. As part of the Technical Architecture Design, an acceptance test plan is developed which will guide the team and the client representatives through a thorough test of the system before placing it in its production environment. Once structural basics are in place, we complete strategy, usability, interaction, user interface, information and technical architecture design. We enter into the third phase of this process. The process is interactive, and facilitated by tools like Figma.

 


knowledge transfer

The UX Design phase includes the following deliverables:

  • User Flows + User Story Maps + Experience Maps

  • Personas + UX-Research report

  • Site schematics + Sitemaps

  • UX-strategy report

  • UX Wireframes

  • UI Prototypes

  • Design systems + Specifications for Developers

  • Usability Testing and Usage Analytics Reports

Technical documentation

Production

Although we are eager to go, we know that it is vital for everyone involved in the project to have an understanding of all its implications. The expertise and input of developers, designers and interface specialists are coordinated in order to maximize the efficiency of the developing process. This phase thrives on the creativity that is the result of effective team working. It's about bringing discipline to the design concept in order to make it real. The result of this phase will be a fully functional and tested site that meets the design and technical requirements approved earlier. The result of this phase will be a fully functional and tested site that meets the design and technical requirements approved earlier.


User Interface Development

User Interface Designers work closely with Web Design Developers and Brand specialists to implement designs. In this way we ensure a seamless progression from initial brand visualization into the fully interactive medium.


Front-end Production

UX Design Developers are responsible for developing user interface frameworks, preparing and optimizing graphical assets, and researching Web technologies and tools. During the Development Phase, they execute complex and dynamic web production tasks, including HTML5 authoring, Javascript, Python and animating web graphics, scanning, digitizing video and audio, and testing on various browsers, platforms, and monitor configurations. They deliver the site's content to the targeted audience.

 

Software Development

Software development kicks off with a detailed design period in which developers share ideas. Although the development process is highly structured, it benefits from the focused creativity of this period. As a result we produce efficient code and make best use of the skills and experience of our team.

 

Operations Setup

This includes the integration and setup of all hardware and software required to support the web site, including the appropriate operating system, web site server, database systems, etc. This stage also includes a thorough integration and acceptance test phase that assures the system performs according to its design and quality specifications. Daily operational procedures are performed to ensure that all work is carefully backed-up and protected from loss

 


Testing

Once visual and technical elements of the design have been fully integrated, its performance, functionality and usability are thoroughly tested.

 


Rounding up knowledge transfer

The Production phase includes the following deliverables:

  • Visual assets

  • Detailed site maps and structure of the site

  • Content - text

  • HTML templates and prototypes

  • Back-end templates and prototypes

 

Deployment

Final deployment of the site will include setup and testing of all work developed by the team on the client's chosen platform, for various browsers supported, and any necessary training in its use and operation.Having reached this phase, the system is ready for migration from the development system to the hosting platform. It is re-tested for functionality and performance under load in this environment. Our aim in the deployment phase is to give the client ownership of the digital environment that we have created together, along with all the tools necessary to forge successful relationships with future visitors.

The Deployment phase includes the following deliverables:

  • QA

  • The site or software

 

Launch

The site goes live!

 

Maintenance

We make sure that the client understands and is fully trained in administration procedures. We provide all the training, documentation and specifications necessary. It is a general policy to work with the client and to review and evaluate the finished project further over the coming months.