Wireframing Popular Apps: Py

Teaching people to code in bite-sized, gamified chunks delivered via mobile app is this innovative app’s mission. Py is an application to learn to program for free in an easy and interactive way. It traces its foundations behind the success of the Duolingo model to learn languages from your mobile which is unquestionably convenient.

The wireflow selected to identify where its initial screens to access a course and the user’s profile. The main purpose behind the selection where to emphasize the clean, minimalist approach which the app is based on since it is incredibly effective with so few screens. It truly embodies the philosophy of “less is more”.

Initially, a wireflow was determined and selected. It can be evidenced in the following sketch used as the initial guideline.

After a close look at every screen, it is visible the Inventory of the UI elements should include:

• Buttons
• Text
• Images
• Icons
• Tabs

Each selected screen would have to be decomposed to its wireframe state, and after the previous analysis it would result in the following:

The lack of a great quantity of UI elements does not mean it is a poor design, on the contrary. This app is a great example of a simple, yet extremely functional interface engaging the user with the least amount of elements and screens as posible to simplify his navigation and understanding of the criteria.

It can be easily followed in the interactive prototype:

https://projects.invisionapp.com/d/main#/console/19314246/403322947/preview