Menu
Search UI
Crowdcube
Meeting user needs quicker though introducing a new search UI to the core webpages on crowdcube.com.
The problem
Crowdcube’s platform holds a wealth of valuable knowledge for both entrepreneurs and investors. The core webpages of investing and raising are focused on surfacing as much of this as possible but they cannot display everything or answer every user’s questions.
The solution
Enable users to control the content through a new search UI. This allows individual users to find answers to their queries with ease from the core pages on Crowdcube. The UI has been built into the existing secondary navigation. To act as a secondary action if the content on the page does not immediately answer their questions or they already have a specific goal in mind.
Search bar UI
The search bar UI stays consistent with the majority of search web patterns, to ensure the UI is familiar and users know how to interact with it. A unique challenge to Crowdcube was making the search UI relevant to each page. For example, a search made on the ‘investing’ page should return results tailored to investing to ensure they are relevant. To account for this a drop-down filter has been added to the UI, clearly setting the expectation of using the search on each page and giving the user the control to override this if needed.
Search results
Once a user has submitted a search query they are taken to a new search results screen, showing them relevant articles, faqs and content pages. The results are displayed using the same card designs used across the site to represent both articles and pages, enabling users to differentiate the content while keeping the site consistent. Users can also refine their search further through filtering at the top of the results. This section makes it clear if a filter such as ‘investing’ has already been automatically applied and gives them a clear action to take to show all results if needed.
Mobile search results
On mobile, the search results page uses a single column with shorter cards. This limits the amount of scrolling and enables more results to be seen on the smaller screen size. The filter UI has also been designed bespoke for mobile, to limit the screen space used when collapsed without sacrificing any functionality. Users can still refine their searches the same as on desktop and can clearly see if any filters have been applied.
