350 likes | 528 Vues
APP-406T. Search: integrating into the Windows 8 search experience. Priya Vaidyanathan Senior Program Manager Microsoft Corporation. Agenda. Search in Windows 8 3 steps to implementing the Windows Search contract Search customizations
E N D
APP-406T Search: integrating into the Windows 8 search experience PriyaVaidyanathan Senior Program Manager Microsoft Corporation
Agenda • Search in Windows 8 • 3 steps to implementing the Windows Search contract • Search customizations • Best practices for building great search experiences You’ll leave with examples of how to • Create great apps that integrate with Windows Search
Users often search to find the content they care about, be it on the web, local machine, network, or in an app.
Apps have rich content, but users have to find and launch the app before searching in it.
Search contract makes your app searchable from anywhere in the system.
demo Search in the system & apps By implementing the search contract, apps are automatically populated in the search list
Search is universally accessible, contextual to your app and always just a single swipe away.
Search anatomy 1 2 • Search box is scoped to the main app on screen • Query suggestions provided by the main app on screen • Autocompletes to terms for which the app has search results • List of installed Metro style apps that have implemented the search contract 3
Search anatomy 4 • Result suggestions provided by the main app on screen • Must include a thumbnail and title • Indicates a strong or exact match result • Takes users directly to the details of the result
demo Integrating with search in a sample app Adding search via Visual Studio Search activation and query submitted Providing query suggestions & ich suggestions
Search settings & events Manifest Declaration Search Pane Events Search Pane Settings Search Registration Search History (on by default) Search Activation Query Submitted File Access Capability Local Content Suggestions Set placeholder text Suggestions Requested
Search activation User Search Pane Search App User selects a Search location Activate App for Search Search Activation Event Query text? No Yes Show Search results view Load previous state
Query submitted Search App User Search Pane Query Submitted Event User enters a query and hits Search Submit query to App User selects a query suggestion Query changed? No Yes Show Search results view Show previous search results view
Suggestions requested User Search Pane Search App User types in Search box Show search history that matches Suggestions Requested Event Request suggestions from App HandleAsync? Yes No Show suggestions from App Add suggestions to Search Suggestion Collection Request Deferral Add suggestions to Search Suggestion Collection Complete Deferral
Search contract recap • Register for search • You can do this easily using visual studio templates • Register and respond to these 3 events: • Search activation • Query submitted • Suggestions requested • Provide search suggestions
Tips when responding to search events • Don’t put one time start up logic in your activation handler • Help the user get back to what they were doing prior to search • Search activation when you are snapped will make your app the main app • Preserve filters that have been applied if users are switching quickly
Search placeholder text • Search placeholder text is the hint shown in the search box when it is empty • Use this to indicate what users can search for in your app • This will automatically be cleared when the user starts typing
Setting placeholder text • //Set the cue text via the placeholderText property in the search //pane • varwinsearch=Windows.ApplicationModel.Search; • winsearch.SearchPane.getForCurrentView().placeholderText= • “Places NearMe";
Separators • Separators can be used to group search suggestions • Provide a label when using separators so it is clear what the groups are
Adding a search separator • // Code that is called when suggestions requested event is fired • function onSuggestionsRequested(e) { • varquery = e.queryText.toLowerCase(); • varsuggestions = e.request.searchSuggestionCollection; • //Add query suggestions to the search suggestion collection • suggestions.appendSearchSeparator(“Friends”); • //Add more query suggestions • }
Should your app integrate with search? • Yes!!! If you would be building search in your app • Use the search charm • You do not need a search box or chrome in your app • Probably not, if: • your app needs a ‘find in doc’ functionality like a PDF reader • you are a game, novelty or utility app
Search results layout • Common ways to represent search results are in a list or grid • Results are ordered top to bottom, left to right • Use the Listview control to bring the Windows 8 look and feel to your app • Avoid putting the most relevant or important content on the right edge.
Search results layout • Give users a way to get back to their prior task in the app • Indicate what the user searched for • Indicate the number of results found
Filters • Filters are essential to helping users quickly find the content they care about • Indicate the number of results available with each filter • Give users a way to remove filters or see all results
Provide suggestions • Provide suggestions to help the user find the content they care about easily • Use query suggestions to help them complete their search term quickly • Use result suggestions to help user quickly get to the most relevant result
Recap • Implementing the search contract makes your app searchable from anywhere in the system! • You can design one search experience that works everywhere • The search template incorporates a lot of the best practices for great search experiences!
Related sessions • [APP-741T] Metro style apps using XAML: Make your app shine • [APP-210T] Build data-driven collection and list apps using ListView in HTML5 • [APP-405T] Share: your app powers the Windows 8 share experience • [APP-408T] Integrating with the Windows device experience • [APP-398T] How to declare your app’s capabilities
Further reading and documentation • SDK Samples: Adding Search • Example of how to implement the search contract • JavaScript, C# and C++ code samples • Windows Application contracts • Search API Reference
thank you Feedback and questions http://forums.dev.windows.com Session feedbackhttp://bldw.in/SessionFeedback
© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.