THINKWallet Process Portfolio

Bido H

Planning

Where did the idea come from? - Why did we decide to further plan and execute the idea?

It’s very noticeable how much time students spend doing their stipend sheets, as much as it is important for TGS it sounds like a hard task for most of the students and a lot of time we procrastinate filling in the stipend sheet; consequently chances are we might lose receipts, forget what we ate, or just lose track of the things we bought. From the other hand however, it might look rude that we are receiving stipend and not documenting properly and up to date in return, in fact, the end of term 2 there was some stress in the cohort because of that. We were not allowed to get our dubai sticker except after Rachel sees and confirms that we have filled in our stipend sheets completely.

Seeing all of that made us think about how can we make this process easier, and even though the three of us have some software skills in different areas, we are still not as experienced in specifically IOS development. However, we are capable to learn and still product something beneficial for everyone, even if that means investing a lot of our time learning, studying, innovating, and programming. And this is where proper planning and collaboration comes.

How are we planning our project?

Practically

Academically

• Initial research before starting the project officially, meetings to discuss our ideas even maybe on break
• Connecting it with academics, when reading academic articles about how big companies project manage, relate it to the practicality of what we are going to do and collaborate together to achieve, including the ways bigger companies brainstorm, etc
• Realizing that this is a big project, and we chose to do it for perp instead of mastery, that also means that we are willing to spend and invest a lot of our time researching and learning
• Create a flexible timeline, we can add or remove things to it as we go.
• Divide our roles based on a proper research

• Think about how to integrate our practical ideas to come up with good learning targets criteria, we can do this thinking process as a group even if we all have different CADs
• Take into account that we need to come up with advanced inquiries, make some of the research based on academic sources to come up with an evident criteria
• Aim to integrate collaboration specifically with the academics and within our table of excellence for all of us, that way we can ensure that everyone is held accountable for their work effort
• Write reflections as we go

My Learning Targets criteria

How can we develop an app that automates expense-related tasks for students at TGS?

Driving Question:

Investigation

How much do students spend doing their stipend?

This is what my Stipend Sheet for Term 1 looks like, it has 104 rows in total. I made an experiment where I calculated how much time it takes to fill in 1 row of the stipend sheet. The time includes: opening the stipend sheet, google drive, searching for the day, uploading the receipt, renaming the file, copying the data to the sheet, and linking the receipt. It takes on average 150 seconds to fill in 1 row. In term 1, I had to fill in 107 rows in total, meaning I can approximate that it took me at least 4 hours to complete the sheet, excluding when I lose receipts and have to search for them which is even more time consuming. Additionally, I’m a fast typer, some people are as fast, some are faster, and many are relatively slower.. People consume even more time doing their stipend sheets

We are busy!

Our calendars are very busy, we fight for some personal time to either take a nap, call our family, or just even scroll tiktok and instagram. Adding more hours per week for anything takes away from our personal time, and this is when we decided to use our skills to come up with a solution for the benefit of the community, and we named it THINKWallet.

Our solution

THINKWallet is an application intended to automate expense-related tasks in TGS, we want to use our expertise of software development to create an application that can:

1- sign in using the google account to identify TGS students

2- have access to camera to scan receipts, text detect what’s on the receipt

3 - categorize based on the text, so it knows the “price”, “date”, “restaurant name”, and all other required information and store it somewhere accessible and readable

4- asks the user to verify the information

5- Uploads the receipt to google drive and link it to the sheet or file in the right category

How to approach our project + initial research

This Miro board has our initial project timeline This document has our initial research + brainstorming ideas. We also added to headrush a list of all the resources we found might be useful in our project

Reflecting after brainstorming, and creating an initial timeline:

​

​

​

Even though school hasn’t started yet, it was fun brainstorming for a project that is not approved yet. All of us had some ideas and together we put them on a document, we also talked about challenges which included the language, will the app be able to identify other languages? It might see English letters, but what about Chinese or Greek.. TGS goes to these countries too, for which case we will need to come up with new solutions, the main focus however is to build a functioning prototype at the very least and we can figure the other challenges later.�A little bit after our meeting, Tashi replied to our email, and we learned that.

Tashi’s email

What we learned from it:

• A previous alumni did a similar mastery project (Justin), the app was never developed because of time constraints and the presentation was screenshots. However, we can still learn from his process which is documented here
• We need to book a meeting with Tashi to discuss ideas and learn from his experience
• When planning our App we have to consider how are we going to extract the data, it should be in a CSV or excel format
• For the app to fully function, we need to consider how to make the students sign in.. it should be like THINKStauts, where we can use our google sign in for to login and do a status update
• Educators use Expensify, which has an autoscan feature, however based on the documentation this process takes about 10mins which is really long. And are we saving time by then?
• Next step is to book a meeting with Tashi
• The data needs to be protected, we might need to use AWS

Meeting with Tashi before project proposal

Before meeting with Tashi, we talked about expectations and what to ask him. Mainly, we were focused on asking him to give us access for google developers cloud, apple developers, and github. He asked us to be very careful having access to the “production” platforms because we don’t want to erase a certificate for instance.. We asked if we could get them as resources since we don’t have a product yet, and we wouldn’t need the access to the production platforms as well.�Tashi said he would provide it soon, and he also suggested that we send a survey to the students showing them different designs and asking them about what they think and what they want, he suggested that taking into consideration the user experience is a good idea when planning the project.

Identifying which data to be collected:

3b.2 novice

Applying the feedback from Tashi, Sending the Survey!

Survey results

Out of 23 responses, 95.7% said that it will be helpful to develop a wallet app

3b.2 novice

Survey results - what would you choose?

3b.2 novice

Survey Results - help in testing the application

3b.2 novice

Survey Results - seeking help from students when needed

3b.2 novice

Survey Results - How would you like to sign in, is it comfortable using THINKStatus? Some responses

Most of the responses pointed out that signing in every time is frustrating, our takeaway from that is while designing the app we need to make sure that we don’t do the same coding error

3b.2 Specialist

Our roles and description

Abdelrahman (Bido) - Founder

Also project manager and Back-End developer

Responsible for the initial research, planning to execute the idea, managing the roles and work. Also responsible for Back-End coding with Swift

Dhruv - UX/UI Designer

Sebastian - Full-Stack developer

Responsible for designing the user interface, conducting surveys and deciding the best ways to ensure great user experience

Responsible to make the bridge between back-end developers and UX/UI designer, assisting in backend programming.

21st Century - Collaboration

Creating a Github page and connect it with Seb and Dhruv

21st Century - Collaboration

The main code is on Github!

After uploading the code and all of us have access to the same project, we decided on a rule to make working together easier. The rule is to make comments to explain the code. That way, if I’m working on the backend and Seb or Dhruv want to adjust how things work on the front-end, they can easily edit without asking me. For example, the code here is for designing the login page.. I was writing this code quickly not focusing on the design aspect a lot because I wanted to test the backend (that was my priority). However, to make it easier to later edit.. I put some comments as “// Loading indicator”, so everyone including myself knows that if we edit this piece of code it’s going to change how the loading indicator looks like, as well as “/ / Sign in button”, etc..

Of course more comments will be even more useful.

21st Century - Collaboration

Reflecting on doing a github page

The main code is on github. However our work style was different since we were onsite, we can easily all meet and work from 1 laptop and test. We didn’t have to commit and make different branches.. It’s still a useful tool however when we can’t meet onsite, maybe if we decide to continue working on the project in break.

21st Century - Collaboration

What is Ethical Scientific Investigation?

The planning and conducting of investigation regarding computer science for my application has to be ethical. According to “Ethics in Scientific Research” paper (by Cortney Weinbaum, Eric Landree, Marjory S. Blumenthal, Tepring Piquado, Carlos Ignacio Gutierrez Gaviria) there are 10 ethical principles common across scientific disciplines, and those are: “They are duty to society; beneficence; conflict of interest; informed consent; integrity; nondiscrimination; nonexploitation; privacy and confidentiality; professional competence; and professional discipline.” Moreover, in computer science specifically, there are some ethics that should shape the planning and conducting of both research and the development of the application. In most cases it relates to either data, ownership, or privacy.

​

5b.1 novice

What is an API? And how can it connect between servers?

API, software interface, and user interface.

Unlike user interface (to make a connection between a machine and a human). An application programming interface is to make a connection between 2 programs or computers, and it’s how applications nowadays “talk to each other”, it’s like a bridge between 2 computers. The aspect that makes them useful is communication, and it abstracts the complicated logic.

A software interface makes connections between programs, user interface specifically makes connection between computer and person. While an api makes connections between 2 computers. For example, the google login API makes the connection between the user’s phone, the script or code, and google’s servers. It demonstrates as follows:

AI 1 novice

Sign in

Client

Google auth server

App script

Building upon other people’s work

If my objective is to get work done, this would include the use of third-party libraries, plugin, packages, or APIs, etc. Reading the license or documentation of the framework is the first and essential step to deciding whether I should continue using the framework or not. For example, using the MLKit by apple developers, in the license it’s clearly specified that it is free of charge. And if I use it, I should include the above copyright notice in the software. So I can in fact use it in that case.

​

5b.1 novice

Used APIs and libraries in THINKWallet - Google APIs

​

​

Link

Using APIs I need to take into consideration 2 things, first: APIs terms of service, and second: the user data policy. I definetly don’t want to be providing other developers with data that is gathered using my application, especially not when I don’t know the source or what are they using this data for. This is why I have decided that I will only use APIs from trusted sources for this application. The 2 source I have decided to use APIs for are apple and google. For Google: I’m using the Google drive API (to make it possible for the receipt to be uploaded. Starting with the terms of service, as specified on this article and last modified on November 9, 2021. Developers are allowed to use Google’s APIs as long as they comply with some rules: including most importantly that we will only try to access APIs from google’s documentation, we will not attempt to mask our identity in the code. We require our end users to comply with the terms and regulations, and we will protect the collected user information and data collected by the API Client to the best of our ability. This applies to using google drive API, google sign in, or firebase. The summary is that we’re allowed to use as long as we comply with the rules, and not knowingly let users “hack” or violate any terms/regulations.

5b.1 Specialist

What is an SDK?

SDK stands for software development kit. It’s like a toolbox for tools or code to call APIs for you, there are SDKs in a variety of languages. I use it in SwiftUI. With the SDK without having to write all the building blocks and call out an API. In short, an SDK is just a pre-packages set of code (for a specific language) that you don’t have to write yourself. Sometimes free and sometimes you have to,purchase them. an SDK can be used in THINKWallet to be able to recognize and collect text easily, using a pre-existing SDK made by apple called vision framework, which is part of the machine learning kit also made by apple. Writing this 2 lines of code without having to clone a repository for example can ease for us calling the APIs, or writing lines of codes that are pre-existing, but instead use the functions go ahead with writing the code immediately, not having to worry about the building block to approach writing the code.

AI 1 Specialist

Other frameworks used in THINKWallet - Apple developers SDKs

​

Recognizing Text in Images

Both are Vision framework

Apple developers documentation is fairly much easier to read and decide to use, it comes in a form of a license when downloading the plugin/API or SDK. the license communicates that the use of any frameworks created by apple is permitted and free of charge, as long as I add this copyright notice in the documentation.

5b.1 Specialist

How to avoid signing in everytime

It seems that it is a known issue that users have to sign in everytime, when using the google sign in API. in The google cloud console they uploaded a documentation to restore the users’s sign-in state. In THINKWallet, we use firebase which automatically does that.

3b.2 Specialist

Skills and Techniques

How to link Github with Xcode

21st Century - Collaboration

Installing cocoapods, Terminal

​

These are a list of commands in the Terminal to install cocoapods. Cocoapods in an application-level dependency manager that manages external libraries and helps in setting up APIs. firebase, etc

Google cloud console + firebase

Firebase creates a User UID number to identify the user next time they use the application from the same device, so it stays logged in.

3b.2 Specialist

Create and refine

Building our first IOS App ever.

This was our first time using Xcode after watching the masterclass! We learned how to build an app and how to simulate it on Xcode, we also learned how we can transfer the app to our devices!

First time the app is actually functioning! | Applying the text detector SDK

Using the Vision framework, we were able to apply a text detection feature in the application by uploading the receipt (if a user previously took a picture using the normal camera application). The application is now able to detect the text on the receipt and the next step is to categorize those based on “price, restaurant name, time, etc”

AI 2 Specialist

Using apple developers SDK,I can easily perform a text-recognition request using simple functions that apple has built the code for and released those function through importing the ML Kit or UIKit

AI 2 Specialist

Taking it to the next step | What if we want to scan from the app directly?

Using Vision work and coding skills, we were able to work on a prototype that allows scanning directly from the application. The majority of the responses from our survey suggested that we have both in our application

AI 2 Specialist

Integrating Google Sign in Button

Finally, integrating the google sign in button in our app, we also took the survey into consideration while planning that. The app doesn’t sign out when it’s closed, and this is because we used firebase auth (which automatically fixes it, we realized through testing) and also adding this piece of code in the App’s delegate to check if the user has used the app previously before launching the app.

AI 1 Specialist

Google Sign in

Displaying name after signing in

Integrating all 3 different iterations together for showcase!

Resolution

Evaluation

Evaluate your process of and approach to this project

We approached this project by planning it from Term 2, we had this idea because as everyone noticed the stipend sheet takes a long time to fill and we wanted to help the community to use this time for something else instead. Our approach was well planned, we conducted proper research and consulted Tashi whenever we needed more information

Our final product for this term is just a prototype, the prototype included aspects that were suggested by users. For example, that we don’t have to sign in everytime we open the application, and that the app has both “scan the receipt” and “upload an image” features.

Presentation of your work at showcase:

• Evaluate your engagement on this project (asking for feedback, responding to feedback, meeting deadlines, etc.)

We were

• Evaluate your Measurable Positive Impact (MPI):

It saves more than an hour per week for students to do something else!

THINKWallet

�Uploading Receipt and text detector prototype