NEW BEGINNINGS

Menow is a joke application I first designed while I was at Startup Institute in the summer of 2016. It was the perfect opportunity to pick up Sketch and InVision at the time, but I've learned quite a bit about mobile design and about wireframing in general since. It's now 2017, and I look back to my previous designs and cringe, so I have decided to redesign the entire application from scratch using Sketch 3 and Flinto, a prototyping tool. Now you get to see the prototypyes in full mp4 glory!

...

Funnily enough, the process of redesigning and prototyping the application lead to yet another learning expierence. Turns out mobile design is more than just slapping rectangles together on Sketch, who knew?!

FORM FIELDS

There was so much to consider when came to the login screen. Boxed or Lined form fields? Pre-filled fields or unfilled fields? How I how do I do motion design? Where do I begin?

I decided to change up the aesthetic of the login screen by opting for a more muted color palette and removing the snapchat-esque buttons on the bottom. Choosing line fields over the boxed fields was a tough from a usability standpoint as the lined fields were more aesthetically pleasing, but not as user-friendly. Apparently, usability of forms is a hotly debated topic, just ask me about how much I struggled with Glassdoor's mobile form sometime!

As you can see, I ultimately went with the line fields, added iconography so that users don't miss thier place, and disabled the login button until all fields were completed. This, and many of the other design decisions I made in building this prototype were based on PayPal's and Instagram's android applicatons, which you will see later on in the upcoming prototypes.

ANIMATIONS

Adding animation opened up a new set of considerations:

• To swipe or not to swipe: While testing the prototype, users noted that they feel the need to "swipe" to move out of the cat's profile (while I like to blame tinder, it's probably because of the way the card animates in). I added swiping as a way to exit and kept the X button on the card for non-swipers.
• Polish, baby: Did you notice how the heart animates along with the swipe or how the menu items stagger when they appear? Those were tiny bits of animation that are pleasing to the user and when I mean user, I mostly mean me. I can keep clicking that like button over and over and over!

As an illustrator, my exposure to animation was limited to drawing frame by frame, so this was a quite the learning expierence; exciting and headache-inducing at the same time.