In my project I'm redesigning a search engine. As a default user is working in a Search mode, but when it turns out something does not exist a user can quickly change to "Create new item". Requirements:

  • desktop app
  • choices are mutually exclusive
  • the selection take effect immediately

I had segment controls but it evolved and right now my mockups show: enter image description here

The toggle switch I have will immediately change the card on the window. So I decided to have the same green button in Search mode and Create mode.

Can I have a better design?

  • Toggle switches are normally used to turn an option on or off, as an alternative to a check box control. Using them for switching modes is unusual. It's difficult to say without seeing the usage in a wider context, but I think I'd be looking at a tab control for this.
    – dosxuk
    Oct 9, 2020 at 10:53

3 Answers 3


I would maybe create a toggle with icons instead :) The second option is to add a toggle button with SEARCH/CREATE inside of the toggle button. the option with text

the second option with icons instead of text:

enter image description here


I assume it is mandatory to search for an item before creating on. Having this in mind I would rather go with a different approach.

Let the user search for an item. Only after the search has been executed show the option to create an item. This could be only available if search does not produce any results or if there are results but not the one the user searched for. Depending on your use case.

It is difficult to answer your question not knowing more about the case. Does creating an item force the user to input more info than just the search term? Is a search mandatory? What happens exactly when creating an new item. etc.

The way you describe the case a toggle and a switch do not seem the right choice to me because they do not reflect the workflow.


The ideal flow for not finding an item is:

  • Search item > Item not found > Enter new item

The toggle solution works but adds an extra step:

  • Search item > Item not found > Toggle to create > Enter new item

Or potentially even more steps if the user assumes wrongly the item does not exist:

  • Toggle to create > Enter new item > New item exists > Toggle to search > Search item > Item is found

One solution that respects the ideal flow is searching first and provide an option to enter a new item regardless if there are suitable results, no suitable results or no results at all.

This is assuming you have an item detail page as well as a create new item page: enter image description here

Consider looking at Google Drive's Sharing modal, where multiple emails can be added from either a suggestion match or created new. The entry field ignores spaces when the entry is not an email. If the user enters an email and presses ENTER or SPACE, it is added as a new entry. Note that there is no intermediate step of pressing an interface button to create the new contact.

Lastly, the solution is dependent on your application and needs (which was not provided in the question). We don't know what we are searching, for what, whether the items are emails or are linked to detail pages with alot more details, etc.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.