Suggest New Design Patterns

Share your ideas for new design patterns with us

Did you spot a new UI design pattern? Suggest a new pattern here! We will do our best to add new patterns we have missed to our library.

Your suggestion for a new design pattern

You've used all your votes and won't be able to post a new idea, but you can still search and comment on existing ideas.

There are two ways to get more votes:

  • When an admin closes an idea you've voted on, you'll get your votes back from that idea.
  • You can remove your votes from an open idea you support.
  • To see ideas you have already voted on, select the "My feedback" filter and select "My open ideas".
(thinking…)

Enter your idea and we'll search to see if someone has already suggested it.

If a similar idea already exists, you can vote and comment on it.

If it doesn't exist, you can post your idea so others can vote on it.

Enter your idea and we'll search to see if someone has already suggested it.

  1. Field Error Indicator

    Indicate clearly errors on the form.

    24 votes
    Vote
    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      I agree to the terms of service
      Signed in as (Sign out)
      You have left! (?) (thinking…)
    • Matrix

      Show items in matrix view. This gives visibility to all item attributes and allows easy comparison between items.

      10 votes
      Vote
      Sign in
      Check!
      (thinking…)
      Reset
      or sign in with
      • facebook
      • google
        Password icon
        I agree to the terms of service
        Signed in as (Sign out)
        You have left! (?) (thinking…)
      • Sliding Date Picker

        Sliding date picker allows users to pick dates with slider bar. By dragging the bar over the time-line, the dates change instantly.

        http://ajaxorized.com/introducing-the-sliding-date-picker/

        2 votes
        Vote
        Sign in
        Check!
        (thinking…)
        Reset
        or sign in with
        • facebook
        • google
          Password icon
          I agree to the terms of service
          Signed in as (Sign out)
          You have left! (?) (thinking…)
        • 2 votes
          Vote
          Sign in
          Check!
          (thinking…)
          Reset
          or sign in with
          • facebook
          • google
            Password icon
            I agree to the terms of service
            Signed in as (Sign out)
            You have left! (?) (thinking…)
          • 1 vote
            Vote
            Sign in
            Check!
            (thinking…)
            Reset
            or sign in with
            • facebook
            • google
              Password icon
              I agree to the terms of service
              Signed in as (Sign out)
              You have left! (?) (thinking…)
            • Completeness Meter

              "Completeness Meter" motivates users to invest more time in filling in the form, for example provide more information about themselves.

              Example image:
              http://www.flickr.com/photos/jannejanne/2533495916/

              1 vote
              Vote
              Sign in
              Check!
              (thinking…)
              Reset
              or sign in with
              • facebook
              • google
                Password icon
                I agree to the terms of service
                Signed in as (Sign out)
                You have left! (?) (thinking…)
              • Extension for Drop Down Menu: Overall View

                When you used a Fly Out Menu, the user see just one section of a website or everytime the whole navigation. The Overall View is an extension to the Fly Out Menu. Once the user has his mouse cursor over the Overall View Symbol, a drop-down list of all sections of the website pulls out.

                We create this pattern for our own website http://www.useeds.de

                Posted originally by Martin Bender

                0 votes
                Vote
                Sign in
                Check!
                (thinking…)
                Reset
                or sign in with
                • facebook
                • google
                  Password icon
                  I agree to the terms of service
                  Signed in as (Sign out)
                  You have left! (?) (thinking…)
                  1 comment  ·  Admin →

                  Thanks Martin, I hadn’t seen this pattern before. The idea is interesting, I’ll keep this pattern in my mind when I start planning new patterns. The only problem I could think of with the solution is how to indicate clearly the “overall view” action.

                • Landing Page

                  When a visitor first arrives at the web site, he sees a web page. That first page/main page is the landing page. How should it look like?

                  See the examples in our Flickr group:
                  http://flickr.com/groups/uipatternfactory/pool/tags/landingpage

                  0 votes
                  Vote
                  Sign in
                  Check!
                  (thinking…)
                  Reset
                  or sign in with
                  • facebook
                  • google
                    Password icon
                    I agree to the terms of service
                    Signed in as (Sign out)
                    You have left! (?) (thinking…)
                  • Save State

                    When a user submits a form which has errors, the form should save the data what the user has already filled in instead of erasing everything. The same applies when going back to a page after accidentally navigating away.

                    0 votes
                    Vote
                    Sign in
                    Check!
                    (thinking…)
                    Reset
                    or sign in with
                    • facebook
                    • google
                      Password icon
                      I agree to the terms of service
                      Signed in as (Sign out)
                      You have left! (?) (thinking…)
                    • Keyboard Shortcuts

                      Providing keyboard shortcuts saves time by letting the user explore UI quickly.

                      0 votes
                      Vote
                      Sign in
                      Check!
                      (thinking…)
                      Reset
                      or sign in with
                      • facebook
                      • google
                        Password icon
                        I agree to the terms of service
                        Signed in as (Sign out)
                        You have left! (?) (thinking…)
                      • Language Selector

                        A language selector is different - as it poses the additional challenge to be displayed in your language versus my language versus all languages available!

                        1 vote
                        Vote
                        Sign in
                        Check!
                        (thinking…)
                        Reset
                        or sign in with
                        • facebook
                        • google
                          Password icon
                          I agree to the terms of service
                          Signed in as (Sign out)
                          You have left! (?) (thinking…)
                        1 2 4 Next →
                        • Don't see your idea?

                        Suggest New Design Patterns

                        Feedback and Knowledge Base