I'm in the midst of developing a very simple web-based CRUD app. Customers will have customer records, and the users of the web app can do their typical Create (creating a customer and a record simultaneously), Read, Update and Delete. Now, I'm torn for best practices on how to make the "start page" the most click-efficient possible.

My design is simple: A nav bar at the top with object names and their actions. That's fine for now. But in the main container, I've identified three actions I want the user to be directed to:

  1. View Customer
  2. Create record attached to customer's object
  3. Add customer's object (and customer, if needed)

All three of these tasks present the user with a search box to search the DB first to identify duplicates.

Now, knowing that there are three simple actions, each requiring a search box, I've struggled with how to display these actions to the customer most efficiently.

Here are my ideas:

  1. Three action buttons - loosely worded as in the list above. Each button, when clicked, will then display a search box (how is irrelevant - but ideas such as fading out the other buttons and fading in a search box is one, displaying the search box in a modal window is another).
  2. A single search box, with the three buttons underneath, loosely worded as in the list above. A good example of this (with only the "R" in CRUD) would be Google's homepage. A single search box, but two options - Google Search and I'm Feeling Lucky. However, three action buttons, I feel, is too crowded.
  3. A single search box, but with a single action button dropdown (Bootstrap theme) defaulted to the most common user action. The dropdown would then allow the user to select the second or third suboption - but at the expense of an extra click.

I realize my situation is pretty specialized, but I'm sure there are some examples of other CRUD start pages that could give me some inspiration. Or, if there is a way you would do it, I would love to hear it.

Thank you!

1 Answer 1


Based on your logic and the goal of wanting to improve efficiency (perhaps by reducing the number of clicks), here is my response to your ideas:

  1. If each button, when clicked, will display a search box then I suggest that it is not quite as efficient as showing the search up front.

  2. A single search box with three buttons doesn't seem to work in the same way as you have described for Google search because the buttons drive the action whereas you still need to have the search results returned before you can decide on an action.

  3. Seems to be an optimized solution to option 2 for layout, but the workflow still doesn't match.

My suggestion, based on my interpretation of what you are looking to achieve would be to:

  1. Provide a search box upfront because it is always the first step regardless of the step.

  2. Based on the search result, provide the action(s) that matches the expected action from the result(s) returned. So if you have no duplicates then the only option is to create. If there are duplicates then you can view or modify/edit. You can also only restrict the edit functionality to only be triggered in a view page.

  3. Test and make sure that this is what the users would expect

  • Thank you! You're right - the action should be on the search page itself. I appreciate your help!
    – Dan
    Commented Jun 21, 2015 at 3:05

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.