To create is to generate a new resource. Creating is distinct from adding, but the two are often confused. To add a resource is to include a resource that already exists.
Use the standard creation pattern when no stepped guidance is needed and the input fields are directly related to each other. This pattern applies to side panel, multistep, and full-page creation flows. You should also provide advanced options for the user.
If there are only one or two decisions to be made during a creation, use a small, standard modal overlaying the content where the creation was initiated. Avoid scrolling inside a small modal.
If you have limited screen real estate, consider using a side panel. Side panels keep the user aware of the context in which they are working. You may choose to use either slide in or slide over panels.
If your creation flow consists of multiple fields and/or supporting imagery, consider the full-page option. Full-page creation flows allow you to take advantage of maximum screen real estate.
If the creation task is complex, consider breaking the process up into multiple steps. Display related or dependent options together.
Multistep creation follows the same principles as standard creation but the creation takes place through several steps. This flow can take place in a side panel or can use the full display.
When any create action is a success, a notification banner can be presented to visually confirm this.
When viewed on mobile, the buttons are positioned at the bottom of the screen.
On a larger screen, buttons should always remain visible to the user.
If a display is likely to extend beyond the visible display, buttons should remain visible and should stick upon scrolling. If only a few buttons are present, they can be placed on the left below the last field.
When including a supporting image, place it on the right-hand side of the window.
Have a minimal set of options visible by default and give a user the option to expose more advanced options. If the user switches to advanced mode, remember this next time they perform the same task.
The advanced option allows advanced users to access all options without overwhelming typical users. It can be applied to the side panel and the full-page dialog.
When any creation is successful, a notification banner should be presented to visually confirm the action.