How It All Started
We sketched the app's main screens, searching for a great UX solution.
After dozens of variations, we came up with something like this:
Wireframes of main screens
Searching for the Right Visual Style
We keep current with mobile app design trends. As such, we knew that flat designs were taking over at hyper
speed. And flat works great with the visual language we had already set up for the worldwide web...a lot of
whitespace, with a juicy red logo and sexy outline icons. The perfect recipe for a modern iPhone app!
Our Style Applied to Other Products
My.com will eventually have a portfolio of other mobile apps, so we had to be certain that our new style would
be compatible with them, as well. Here are some concepts; however, final apps could differ from these:
Then iOS7 Came Out...
We worked hard to find a unique look for our product portfolio. Needless to say that there have always been similar
designs with white menu bars and minimal visual styling, but they weren't mainstream. So by the end of May,
we were proud to be the ones to stand out in the crowd.
visual language for one of the most popular mobile platforms,
one in which we wanted to launch our first apps. Yikes!
We explored alternative approaches to styling our app.
But after taking a break to reconsider that option,
we went back to our original vision.
Bingo!
We loved this one the most! It was clean and modern; focused and uncluttered.
It also displayed emotion and personality, due to its sexy icons, juicy color accents
and lively UI animations.
Let's Look at the Details
We put a lot of thought and effort into the tiniest details. We believe that's how you should take care
of a mobile app design - build it to be useful and valuable as a tool, but make it a delightful and
pleasant experience.
to folders, accounts and other additional
features.
attachment previews and sender information.
Forms & Actions
This is where you can make users happy, as well as have fun yourself. As it always
should have been, engaging interaction is where mobile design is actively heading.
Tutorial
Compose
Login
Icon Set
In order to compensate for visual minimalism, we wished to express emotions in the details.
We also wanted to make icons a part of the My.com identity - looking handwritten makes
them appear more human.
Main UI
Attachments
Blank states & errors
Actions
Application icon
.&p%5Bimages%5D%5B0%5D=http%3A%2F%2Fmymail.my.com%2F200x200.jpg%3Fv%3D1){kind=link}
.){kind=link}