UXD and UI Design for this "Dual Modal with Social Login". Here we see an Annotated Photoshop Wire illustrating the 2 scenarios (Log in or Create an Account).
Noteworthy: This modal "flips" in that if the user is already a member, they can click the link at the bottom to "flip" the modal to the "Already a Member" login form. Whatever the scenario, the Social Login remains persistent to the top of the form, always offering the user the choice to login with their Facebook credentials.
This example is referred to as a dual modal (Sign Up or Sign In), in that the user can Create an Account or Login. Here we opted for "Create an Account" & "Login" for the naming schema to match the rest of the site, so the user has a consistent wayfinding experience. Also, buttons & form fields were kept the same width to keep the form looking clean and for faster coding.
This example is referred to as a dual modal (Sign Up or Sign In), in that the user can Create an Account or Login. Here we opted for "Create an Account" & "Login" for the naming schema to match the rest of the site, so the user has a consistent wayfinding experience. Also, buttons & form fields were kept the same width to keep the form looking clean and for faster coding.
