I am in the process of re designing a registration workflow for a social app. The nature of its content is very generic, food related stuff like recipes, cooking tips etc. The signup form is planned to be shown inside a model window. We want to encourage signups through Facebook, while giving an email signup as an option.
I wanted to avoid taking users to multiple screens for signups/signin and use the same model for everything related to on boarding. Hence, tried to incorporate three things- Sign Up, Login, Forgot Password within the same form. When the user focuses on the email field, we will collapse the top section and use the space for additional fields and call to actions. The action button label would change according to the choice the user makes.
For Signup it will "Signup as a New User" for Existing users "Sign into your kitchen" and for forgot password "Send recovery instructions"
What do you think of this approach? Do you see any complications in this? Screenshots attached.