WEEK 12

SKETCHES AND WIREFRAME

ANNELIES NAFISA
05211942000011

Sketches

Here are some sketches that will describe the use of Bibit collaborative savings method.
Feedbacks
1. There is no option for sign-up in sign-in page. It seems simple but it also seems very
unprofessional not to provide an essential thing especially when we start something. It
also can be categorized as major mistake, which can have an impact on the customer
willingness to continue using our apps.
2. User should not be able to choose any other plans. In the previous sketches, users are
allowed to add their own financial plan unprovided by Bibit. They can customize the
group, the plan, and things that are not a program for Bibit. This can be a problem
because there should not be something like this just to make the system consistent
from the start and prevent users from any confusions.
3. Remove the shares display. Shares display must be only shown to the users itself, when
in the previous sketch other users in the group can see their friend’s share. It will be
confusing to the user to see a lot of analytics graphs so it is better to only show the
saving progress.

Wireframe

WF01 WF02

This is the new sign up & sign in display for the app. User should be able to do their registration
only using email and it is better if the email is also connected with several social media to help if
the users forgot their password. After the sign up, users also need to check and agreed with the
terms and conditions provided before they start using the apps.

WF03 WF04

Here is the main display of the apps. There will be home, savings, groups and leads. Here, we
are focusing on how the savings work. In savings, we can see several things related to the
savings information that the users had. In the right-hand side, We can also figure out how the
report of user’s savings is displayed. There is three basics information in the dashboard,
progress, analytics, and total savings. If before we also can see the shares, now we can only see
the saving progress of each member in the group. From the color, we can also point out that if
the color is getting darker, it means our progress is almost done or achieve 100%.
 WF05 WF06

These two wireframes are showing two different things. In the left-hand side, it is the group list
and in the right-hand side, it is showing the saving plans. But actually, both is connected. If the
user already has at least one group (just like the pic above), and they never use the apps
before, the system will automatically direct them to the saving plans page. In that page, users
can also click the blue text about how they can use plans and the system will give a tutorial
about how it works.
 WF07 WF08

Last is about the Plan after the users click it. Here, we both plans with two different pages. In
WF07 is for the marriage plans, but when the user did not have a partner yet. The (+) button on
the upper side is for create a new plan. This is the example of the system if the user also has not
used the apps yet and try to create their first plan. The system will directly ask them to add
partner and start their first plan.
Meanwhile in WF08, we can see the payment method page in the business plan. If the user is
planning to have a business, then it can add more than 2 people in the system. The picture
above is showing 3 users that had been savings for some time and there, the system also shows
the total savings and payment method they use. In the lower side, they can also choose other
payment method provided by Bibit for the group in order to ease the member if they want to
pay from another bank account or e-wallet.