Оформление надстроек OfficeDesign your Office Add-ins

Надстройки Office расширяют возможности Office, предоставляя контекстные функции, с которыми пользователи могут работать в клиентах Office. Надстройки предоставляют доступ к сторонним функциям в Office без необходимости переключаться на другие приложения, что отнимает много времени.Office Add-ins extend the Office experience by providing contextual functionality that users can access within Office clients. Add-ins empower users to get more done by enabling them to access third-party functionality within Office, without costly context switches.

Дизайн интерфейса надстройки должен органично интегрироваться в Office для эффективного и естественного взаимодействия с пользователями. Настройте команды надстроек для представления доступа к надстройке и воспользуйтесь нашими рекомендациями при создании пользовательского интерфейса на основе HTML.Your add-in UX design must integrate seamlessly with Office to provide an efficient, natural interaction for your users. Take advantage of add-in commands to provide access to your add-in and apply the best practices that we recommend when you create custom HTML-based UI.

Принципы оформления OfficeOffice design principles

Приложения Office соответствуют общему набору правил взаимодействия. Приложения имеют общий контент и элементы, которые выглядят и работают одинаковым образом. Это сходство основывается на наборе принципов разработки. Принципы помогают команде Office создавать интерфейсы, которые отвечают задачам клиентов. Их понимание и соблюдение поможет вам создавать решения, которые отвечают целям ваших клиентам в Office.Office applications follow a general set of interaction guidelines. The apps share content and have elements that look and behave similarly. This commonality is built on a set of design principles. The principles help the Office team create interfaces that support customers’ tasks. Understanding and following them will help you support your customers’ goals inside of Office.

Соблюдайте эти принципы оформления Office, чтобы ваши надстройки не вызывали у пользователей никаких неудобств:Follow the Office design principles to create positive add-in experiences:

  • Разрабатывайте специально для Office. Функциональность, внешний вид и удобство использования надстройки должны гармонично дополнять возможности Office. Надстройки должны соответствовать дизайну Office. Они должны легко интегрироваться в Word на iPad или PowerPoint Online. Хорошая надстройка — это органичное сочетание дополнительных возможностей, платформы и приложения Office. Рекомендуем использовать для разработки язык Office UI Fabric. Применяйте тематическое оформление документов и пользовательского интерфейса.Design explicitly for Office. The functionality, look and feel of an add-in must harmoniously complement the Office experience. Add-ins should feel native. They should fit seamlessly into Word on an iPad or PowerPoint Online. A well-designed add-in will be an appropriate blend of your experience, the platform and the Office application. Consider using Office UI Fabric as your design language. Apply document and UI theming where appropriate.

  • Сосредоточьтесь на нескольких ключевых задачах. Помогите клиентам выполнить одну задачу так, чтобы это не помешало выполнению других. Предоставьте клиентам нечто действительно ценное. Сосредоточьтесь на основных вариантах использования и тщательно выберите из них те, которые принесут пользователям больше всего преимуществ при взаимодействии с документами Office.Focus on a few key tasks; do them well. Help customers get one job done without getting in the way of other jobs. Provide real value to customers. Focus on common use cases, pick carefully those that benefit users most when interacting with Office documents.

  • Содержимое важнее, чем хром. При работе с надстройкой внимание клиентов должно оставаться на странице, слайде или электронной таблице. Надстройка — это вспомогательный интерфейс. Вспомогательный хром не должен мешать работе с содержимым и функциями надстройки. Размещение фирменной символики требует разумного подхода. Мы знаем, что важно сделать надстройку уникальной и узнаваемой, но фирменная символика не должна отвлекать пользователей. Стремитесь, чтобы основное внимание уделялось содержимому и выполнению задач, а не символике.Favor content over chrome. Allow customers’ page, slide or spreadsheet to remain the focus of the experience. An add-in is an auxiliary interface. No accessory chrome should interfere with the add-in’s content and functionality. Brand your experience wisely. We know it is important to provide users with a unique, recognizable experience but avoid distraction. Strive to keep the focus on content and task completion, not brand attention.

  • Сделайте работу с надстройкой приятной и разрешите пользователям самим выбирать, что делать.Make it enjoyable and keep users in control. Людям нравятся функциональные и красивые продукты.People enjoy using products that are both functional and visually appealing. Тщательно проработайте свою надстройку.Craft your experience carefully. Уделите особое внимание мелочам, учитывайте все варианты взаимодействия и внешнего вида.Get the details right by considering every interaction and visual detail. Разрешите пользователям самим выбирать, что делать.Allow users to control their experience. Действия, необходимые для выполнения задачи, должны быть понятными и логичными.The necessary steps to complete a task must be clear and relevant. Важные решения должны быть понятными.Important decisions should be easy to understand. Отмена действий не должна вызывать затруднений.Actions should be easily reversible. Надстройка — это не конечная точка, а улучшение функциональности Office.An add-in is not a destination – it’s an enhancement to Office functionality.

  • Поддержка всех платформ и способов ввода. Надстройки предназначены для работы на всех платформах, поддерживаемых Office, поэтому интерфейс вашей надстройки должен быть оптимизирован для различных платформ и форм-факторов. Реализуйте поддержку клавиатуры, мыши и сенсорных устройств ввода, а также убедитесь, что пользовательский интерфейс на основе HTML адаптируется к разным форм-факторам. Дополнительные сведения см. в статье Сенсорный ввод.Design for all platforms and input methods. Add-ins are designed to work on all the platforms that Office supports, and your add-in UX should be optimized to work across platforms and form factors. Support mouse/keyboard and touch input devices, and ensure that your custom HTML UI is responsive to adapt to different form factors. For more information, see Touch.

См. такжеSee also