PROJECT WORK 8A: Sketchy Screens

Team Members: Anjali, Dorien, Ellington, Ji Hong, Karson

 

Sketchy Screen: 

 

Anjali:

I made a sketchy screen for the decision making pathways once the focus timer has been initiated. This is important to the functionality of the app because after people start their focused time, it is likely that they will be tempted to use their phone as usual. The “nudge” screen reminds them what they have to lose if they get distracted and helps them turn staying focused into a long-term habit.

 

Dorien:

I wanted to focus on the screens that involved the results of the competition and adding friends to compete with. I wanted to highlight the ticking timer signaling the competition has started (although the users should never see the timer). And then I wanted to highlight what the screens would look like if they lost. It’d show who was still in the running for getting their donations moved to the correct pot. I also wanted to highlight how the app would highlight how much money is being donated to which political parties and why so users could really get hit with the social pressure. 

Ellington:

I chose the social UI/UX screen. I chose it because the social dynamic of our app is crucial to bring in new users as well as engage current ones. In the first screen, it shows how users can sign in by simply tapping the menu icon and then choosing an authentication provider. Afterward users are signed in, they can see a list of their friends and challenge them to focus. This sends a link to their friends iMessage, which when click launches the app to allow both people to start studying. A timer begins and the last one to stop wins. The winner can then brag to their friends about how they studied longer than their friends.

 

Ji Hong: 

* Sketchy screen depicting the timer and donation process–there are other things on there from the work we’ve done in class *

 

Justification: For my sketchy screens, I focus on the timer and donation aspect of our app. As those two are our most crucial features, I decided to only draw things that pertain to those functionalities. Throughout the class, we learned about different ways to distribute and group information, so the other screens in the picture are just revamped screens after applying these updates. We wanted to keep things simple and straightforward as this is a focus-based app and we don’t want people who are seeking to gain focus using our app but getting distracted by unnecessary design obstacles. 

 

Karson:

Justification: For these screens, I chose to focus on the payment settings pages. I focused on these screens because it is a critical element of onboarding a new user. For the profile screen, I included the ‘Payment Method’ button which takes the user to a page with more details. This first page is important because there will be instances where users will want or need to change or see their payment method. The second page addresses the key important details about the payment method. What payment method the user clicks will dictate what subscreen they are taken to (Paypal login, card details, etc.) After filling out the necessary fields, it takes the user to a final screen that has agreements relating to payment as well as a summary of the payment information for the user to review before saving the method.

Avatar

About the author