Wix Site Search App
Installable app for Wix Websites.
Wix Site Search is an application developed by Wix as an effort to provide our users with a search function, a critical feature they were missing from their websites. For users who ran E-commerce websites or Blogs on our platform, this was a serious gap. We brought a simple solution they can implement on their websites, without having to seek out third-party solutions.
Research & Wireframing
I started my process with extensive research of various websites. I look for anything which can indicate to me how the "search" features is implemented on these websites, types of website which use it and their content structure, user journeys and behaviors these websites present. This research gives incredibly valuable insight to our user expectations when they are building a website using Wix. Although With our product, we needed to make sure we cover cases that fit all Wix editors. From simple use cases in Wix Editor to complex ones in Editor X. Our grid had to be scalable and adaptable to all of these.
Goals and Challenges
I joined this project as the main product designer. In close collaboration with other departments, we set out with some main goals we wanted to achieve in order to provide our users with a solution that works “out of the box”. As well as provide customization options that meet the market standards and match user expectations.
Market Research (Design, Experience, and Features)
Handle the end to end UoU and On-Stage Customization flow
Implement Customization Features in collaboration with the Dev team
Craft a scalable, design system -based solution
Defining Component and App behavior across all devices
Defining on-stage Interactions and Customization Features
Make sure App Design matches the Users website
Editing Features and Capabilities
We designed the On-Stage interactions with the product differently according to the requirements presented to us by users of our Website Editors. "Wix Editor" is focused on DIY simple users, who prefer an "out of the box" solution. Whereas Editor X users come from a more technical/professional background and prefer a hands-on approach to their website building. Our solution aims to provide a way for both of these user groups to implement the app.
To make sure that the App matches a user's website right after installing, the design is completely "wired" to the user's website theme. Customization options were split into different holistic areas, which directly correspond to changes a user has already made, and applies them to our app.
Site Search App rendered in Wix Editor environment, based on the 980px grid.
Site Search app rendered in Editor X environment, a fully responsive editor experience.
Site Search App installed on 4 different websites, design and content is automatically matched to users decisions.
Design System and Interaction Definitions
With the implementation of our own Design System, which we share across all of Wix apps, we make sure that our user's website has a consistent look. As well as, make sure our solution is scalable and future-proof, in case of new features being added by a different team. Carefully defining the on-stage interaction with components, in order to minimize the possibilities of errors and prevent user frustration.
Search App - Results Page Grid System
Search Widget, Ineractions
With the release of the Site Search app, we answered one of the top feature requests for user websites (having a search function on their site), with an almost immediate decrease in new tickets. Post release we saw that around 2% of new websites have tried the Site Search app, and UoU (User of User) success at navigating the app was at around 90%.
Automatic Data binding, based on Users website setting.
Theme mapping, to match the design of users website.