ATM Locator
ATM Locator enables cardholders to search for ATM locations around the world. VRL Locator allows a VISA reloadable prepaid cardholder to add funds to their account from merchant terminal.
Problem and goal
Currently, the marketing activities and offers available on the website are not displayed in the mobile app. This leads to the following issues:
- Users are not aware of discounts, new courses, and bonuses.
- Low user engagement in marketing campaigns.
- Loss of potential conversions into purchases through the mobile app.
Key metrics
- High QualityWe are a leading firm in providing quality and value to our customers. Each member of our team has at least 5 years of legal experience.
- Good SupportOur managers are always ready to answer your questions. You can call us at the weekends and at night. You can also visit our office for a personal consultation.
- Individual ApproachOur company works according to the principle of individual approach to every client. This method allows us to achieve success in problems of all levels.
Discover phase
I held a working stakeholders meeting which focused on discussing the problem and defining the tasks and the road map.
URD writing
Personally, I was tasked with working out the user requirement document based
on researching Google and VISA API and business requirements. In this document I identified
on researching Google and VISA API and business requirements. In this document I identified
- Most important data
- Features
- Map elements
- Filters
- Entry point
- Permission logic
user requirements document
I spent a fair bit of time looking at the direct deposit flows in different apps on the US market (Revolut, Chime, N26, Current) and researched and collected the main patterns for direct deposit connection.
User requirements document
Google Maps API
VISA API
Competitive analysis
I spent a fair bit of time looking at the ATM locator in different apps (Revolut, Chime, Tinkoff, Alfa, Sber) and found downsides in each one of them. Also I researched and collected the main patterns and map's behaviour to gather useful insights
Competitive analys
Design phase
User flow
I identified entry points and made a roadmap for this whole feature.
User Flow
Prototyping
The next step was the design of the main screen on which the interaction with the card and the search for ATMs take place. The main artifacts of this screen are:
- Google map
- Sheet
- Switcher
- Geolocation button
- ATM pins
- User’s pin
Set up Direct Deposit screen
Map — When designing the interaction between the card and the user, the main patterns of interaction with the card were defined and described in detail in the specification. When designing, a lot of questions arose, the answers to which I looked for in user interviews and in studies of similar applications.
- What is the default map zoom level?
- How does the map behave when zooming and swiping?
- How does the user pin behave when rotating the phone?
- What zoom level does the map go to with double tap?
- How many found points are to display in the sheet?
- What to show if the user has not allowed tracking of his geolocation?
Sheet — First, I selected all the data that can be obtained from the ATM from the VISA API, prioritized and structured them. Qualitative research - in-depth interviews with users - helped in prioritizing this data. Next, I designed the arrangement of information in the card, described their sorting, scalability logic, and supplemented this artifact with relevant filters supported by the VISA API.
The second stage was the design of a separate ATM sheet, where all the information on this point is already provided, as well as the main CTAs: share geolocation and build a route. Taking into account the specifics of the market, we labeled all the buttons and minimized the use of icons in them. To save development time, it was decided not to build a route to the ATM inside the application in the first release, instead to open a native pop-up with options to continue the route in pre-installed navigation applications.
Switcher — The main task of the switcher is to make a fork between loading and withdrawing funds.
ATM pins — Before designing this artifact, there was a dilemma - whether to save developers time and take standard pins from Google or customize pins, which increases development time.
As a result, customized pins were chosen, since in addition to ATM pins, pins of other objects (business, attractions, etc.) should be located on the map. And for better navigation, all these pins should be different from each other.
As a result, customized pins were chosen, since in addition to ATM pins, pins of other objects (business, attractions, etc.) should be located on the map. And for better navigation, all these pins should be different from each other.
Geolocation button and user pin — These elements and their interaction patterns were taken into implementation by means of Google, thus we saved time for their design for the whole team.
Result
Through some iterations, we defined the visual design for the whole feature. This is what the first version of the features looked like when I finished.
I wrote a specification and presented it to the developers. In the specification I described all flows and necessary information for implementation. In the result we created a feature that shows various directions in search for the nearest ATM and VRL points, with additional information about them provided
I wrote a specification and presented it to the developers. In the specification I described all flows and necessary information for implementation. In the result we created a feature that shows various directions in search for the nearest ATM and VRL points, with additional information about them provided
