Carshare Signup Experience

1 Attachment

9 Responses

  1. Meng To Meng To

    Inspired by the iOS7's transitional experience, I crafted the Carshare's signup experience around that.

    Check out the Full-view

    1) The background interface blurs with a 50% black overlay and make way for the signup modal which drops from the top using a rubber band effect.

    2) The user then selects if he wants to rent cars or list his car for rental. From there, the UI transitions without reloading to a larger UI (window becomes taller, top photo becomes larger, red button slides down and content appears in the middle).

    3) The icons are slightly animated and show information based on the type of user you are. Visual design-wise, those icons are basic Symbolicons Line icons separated in Sketch and each layer was given a different colour to match the Carshare style. An overall drop shadow was given to the icon to add a little bit of depth.

    4) The user confirms his basic info and is given an option to skip the email verification by connecting with Facebook.

    5) Since Carshare depends on a trustable network, the user is given the option to verify his phone, insurance, etc. in a 3-step process.

    Sorry for the long description. I'm trying to explain more my thinking process behind my projects and bring a little bit of UX to the UI on Dribbble. :)

    @mengto

    likes

    8 months ago

  2. Rex Z Rex Z

    NICE, I like icons~

    likes

    8 months ago

  3. Meng To Meng To

    @Rex Z Thanks Rex, glad you like the icons as they are the main heroes of each page. :)

    8 months ago

  4. Avinash Tripathi Avinash Tripathi

    Awesome... Sir, in the second screen under List your car would you consider making text center aligned with the icons?

    likes

    8 months ago

  5. Jay Robinson Jay Robinson

    This is great! Love to see more detailed explanations behind designs. Have you thought about showing the animation with After Effects or similar program?

    likes

    8 months ago

  6. Khurram butt Khurram butt

    Nice

    likes

    8 months ago

  7. Meng To Meng To

    @Avinash Tripathi Yep, that makes sense. Thanks for pointing that out!

    @Jay Robinson I'm dying to learn an application like After Effects to lay out the UX/animations more. I wish there was an effortless way to do and easily share. For now, I'll have to learn those intensive applications.

    @KhurramButt Thanks for leaving a comment!

    8 months ago

  8. Andrey S. Rodrigues ☝ Andrey S. Rodrigues ☝

    nice work

    likes

    8 months ago

  9. buatoom buatoom

    great!

    likes

    8 months ago

keyboard shortcuts: previous shot next shot L or F like