Solitaire X is a solitaire app for iOS. It was originally developed by my brother Adam and I over the summer of 2013 and we have been updating and improving it ever since.

Neither of us had any iOS coding experience at the time so we decided to take a simple idea and give it a major visual revamp for iOS 7 which was launching in the fall. The app came together over two months of part time work and released on September 20, 2013 for $1.99. The app has since been made completely free and is available in the App Store with more than 1 million games played around the globe.

Design

After we saw the new design direction of iOS 7 unveiled at WWDC. We started by looking at the cards themselves and tried to remove the clutter and skeuomorphic aspects usually associated with card games. Large clean icons with the cards value in white type looked the most appealing while retaining readability. Instead of simulating the cards being flipped over we opted for a juicy morphing transition. To accomplish this first we made the suit icons in Adobe Illustrator and then brought them into After Effects for the animation.

Each of these were exported as image sequences to be used in the app. Next we wanted to include some of the new design patterns from iOS 7 like transparency, blurs and more physical interactions. The stacks were another source of visual clutter. We hid the card stacks behind a translucent glass panel that houses the deck and the foundation stacks. We made the full stacks available with a slick pull-down animation. The final step to tie everything together was to leverage the new UIKit Dynamics to add physics into the app. We simulated each stack as if the cards were being hung from a rope tied to the top. This added a lot of physicality to the experience and made pulling stacks of cards around a rewarding interaction. Seeing everything react and sway and you move things around has a very natural, fluid feel.