Login Form Design case: Web page and App login form

Article Description: Web page and the beautiful landing form in the app.

I collected 20 beautiful landing form cases from dribbble. I hope you can benefit from it and help with your landing form design later. Designing a landing form looks very easy, but most of them are poorly designed and have no bright spots. In any case, this collection of dribbble cases is definitely going to be another extreme. Hope they can win your favor! Come and enjoy it together:

Landing forms in Web sites and apps

Inherited the essence of iOS7, this landing interface works will iOS7 the subtle animation background to a new level. The background here is entirely an animated picture--maybe even a gif. Although the background is not as delicate as it is, it must be an uncommon design. It's almost impossible to see apps like this, and the first screen design is so ostentatious.

Also adhering to the spirit of IOS7, the landing interface and its subsidiary interface with a color fuzzy background, so that everything remains absolutely concise. I'd say these two interfaces are fairly simplified, and the actual input boxes are replaced by thin lines. But the wonderful colorful background adds personalized color, make the work kind and beautiful.

If there is a pleasing design, then this is the one. The blue background image contrasts strongly with the crisp white logo, text, and input box. The green button looks like a real button-even though the rest of the interface is flat-the tones are very good with blue.

What a striking color! Of course, it is the product of thinking about the login box from another angle. This is not a normal login window because it still has flaws in usability. But in terms of design, we can jump out of the rules to think about the landing interface.

Compared with those before, this one is quite calm and concise. The color was very good. The page is also very pertinent, it does not have any unnecessary (even disturbing attention) tricks, any landing interface should not have.

This is also a bold landing interface design. Dark landing interface, dark fuzzy background, bright smooth and slender font, creating a mysterious atmosphere and magic. With the charming landing interface, there is no other request.

It now presents a dark landing interface with unusual red text and buttons. I'm not sure it's the right amount of red, but let's go ahead-it's an extraordinary bold design that deserves cheering. I think my fear of red is unreasonable, because the decision to respond to the user is the red button in the environment, rather than the red itself. I'm sure no one will feel a crash while pressing the login button.

This work is definitely one of my favorites in this article, because it's simple enough, but not monotonous. Its color is quite stunning, several colors perfect combination. Besides, it looks really good! It is really a good way to create a simple and beautiful login interface.

This is a slightly more complicated landing interface. Like most platforms today, you can already have an account to log in, such as Google, Twitter, or Facebook, without having to create a new account on every new site. But if you want, you can also register your account.

The interface is creative-handwritten notes and arrows, which add some personality to the interface, and are also good colors, which are different from the common blue and silver. At the same time, unlike most current landing pages, its background image is not a visual focus, it is a lightweight landing/registration page.

I really appreciate the design of this slack. No distracting navigation, no annoying other content. The user's operation is as simple as the target: Select Platform or Opentag, and then log in. If this is the first time, you can try the "register account" link at the bottom. I think this is really a good organization and implementation of the landing interface.

This is also one of my favorites, I am fascinated by its flat design. It's not much of a distraction, but the point is landing. Concise logo effect is extraordinary, if you do not have an account, you can register in this one. In addition, the selected color is also closely combined to perform well.

I like this design very much, because the thing is big enough, the landing button is very big, the text on the button is very big, the icon is also very big. Now you should have some experience. In addition, the landing button is bright orange-red and you will not ignore it. It will not be confused with the surrounding environment, and all actions that need to be emphasized should be so.

I'm not sure I agree with the input box background and text color, but beyond that, it's still an excellent monochrome form design. I like the way these two input boxes are combined, because they are obviously one. I also like the striking landing button.

It's great that the site remembers who you are before you log out of the landing. Looking at it, it wants to create a sense of secure login, and it is true, thanks to the two Logo--mcafee and VeriSign below. I also like its funny avatar, which makes the whole interface experience so enjoyable, although it's actually very serious.

This is my third favorite work, because it's fun to color. Yes, it's a flat design. Such a basic style, it should be very monotonous, but it does not. I've found that a flat design with carefully selected colors can often be successful, because it is full of intimacy and personal color, this landing interface is so! I would like to see more of these designs in apps and websites that I use frequently.

Ah, is also a blue interface! I'm skeptical about the green I use here, but the subtle changes in the blue in this work, combined with the white text, are really good. The informal writing body also adds a bit of personality to the entire interface.

I quite like this form because it's obviously the visual center of the page and there's nothing else distracting me. Of course, there are logo and invitation to register links, but they can not cover a huge landing screen anywhere. In contrast to darkened background images, the bright input box attracts attention, allowing you to log in immediately.

This is a piece of UI work that is intended to be materialized with a flat combination. What do you think? I think it's handled very well. Do not laugh at the shadow effect of the elements, they do not affect the entire design, the design here is quite intelligent, the use of the proposed physical and chemical elements, the choice of fonts and color matching cast the work.

It's also a fascinating landing interface. Its content is richer than many of the designs in this article, but the color selection is very good, so that the interface beautifully combined into a whole.