Optimize the UX for your add-in
As you design your Office solution, consider the overall user experience (UX) and how you will deliver a solution that’s seamless and user friendly. To create a great add-in, provide an engaging first-run experience for your users and design a first-class UI. This section focuses on best practices for Office and SharePoint Add-ins.
Office Add-ins
Create add-ins that help your users complete their tasks quickly and efficiently by:
- Envisioning and planning your experience.
- Developing engaging interactions.
- Integrating seamlessly into Office.
Outstanding Office Add-ins will:
- Apply UX design principles.
- Provide a net value that exceeds that of alternative solutions.
- Enhance and complement the features that Office provides.
- Deliver continuous, data-driven improvements to the Office experience.
SharePoint Add-ins
SharePoint Add-ins must be easy to use while allowing users to quickly realize the benefits:
Your add-in should be fully self-contained and can:
- Provide additional web parts that can be used on home pages.
- Extend lists and libraries and provide extension points.
Outstanding SharePoint Add-ins will:
- Blend into the natural user experience of SharePoint.
- Have a consistent look and feel, including colors, styles, and UI.
- Provide a clear navigation link to return the user to the SharePoint site that launched the add-in.
Apply UX Design Principles
You only have a short time period and limited space to portray the value of your solution. Consider the following as you develop your UX:
- Does your user understand the value of the solution?
- What steps do customers need to take to use your solution?
- How do users interact with your solution?
When designing your Office add-in, apply the following principles to your UX design:
- Ensure that the look, feel, and functionality of your add-in complements Office.
- Maintain simplicity and a seamless user experience.
- Optimize your add-in for touch.
- Develop a similar look and feel across different platforms.
- Use add-in commands to:
- Provide relevant UI entry points for your add-in.
- Identify granular actions for common tasks.
- Minimize the number of steps to complete actions.
- Apply Microsoft icon design guidance.
For more information:
- See the best practices for developing Office Add-ins.
- Find guidance for creating UX components for your SharePoint Add-ins.
- Use Office UI Fabric to help ensure that the look and feel and functionality of your add-in complements the Office experience
- Use the UX design pattern templates for Office Add-ins to apply common interaction patterns .