If you want to do something well, do it yourself.
iOS app developer in numbers.
The first education is economics.
For a long time Sergey held the position of a leading specialist in a bank, but, fortunately for us, he decided to find himself in IT (and found!)
5 years ago started studying technologies related to web and mobile development. Managed to work with projects on freelance and in the offices of IT companies.
For the last 3 years, has devoted himself entirely to the development of iOS applications. The choice was obvious, because Sergey is a big fan of apple gadgets. «The range of Apple users is huge, so by making applications for their devices, the developer will definitely succeed, …» – Sergey decided.
Sergey has managed to develop applications for the following projects:
bloggermall.com.ua — iOS development, creation of pixel design, screen and navigation between screens, adding transitions and animations. Building a functional part based on an API call to the server, creating application components and setting up libraries.
leev.com — iOS development, application publishing in the App Store. Creating a pixel design with Figma, adding transitions, animations, screens and navigation between them. Building a functional part based on an API call to the server, creating application components, setting up libraries and a multilingual structure dependent on the language of the system. In addition, Sergey created a Google map with the location of the apartment and set up his own library of calendars.
PDR Ukraine — iOS development, application publishing in the App Store. Creating a pixel design with Figma, adding transitions, animations, screens and navigation between them. Building a functional part based on an API call to the server, creating application components, setting up libraries and a multilingual structure.
15 Puzzle — iOS development, app publishing in the App Store. Creating pixel design and application components, setting up libraries, implementing navigation between screens, adding transitions, animations and a multilingual structure.
Stack
-
SWIFT
- registration and authorization of users;
- blogger profile with a description and detailed analytics of the target audience;
- blogger's advertising account;
- payment system through the UAPAY service;
- messenger.
This is what we actually did.
The design department received the task to design layouts for the mobile application. And for our iOS developer, with 5 years of experience, one large-scale task “Develop an application” immediately broke into several specific steps:
- Create pixel perfect based on design layouts;
- Develop application screens, navigation between them, transitions and animations;
- Build a functional part based on API calls to the server part;
- Create application components and set up a library that will match the functionality and design of the layouts.
Read more about how we implemented the project in our case study.
Technological solutions
When developing complex applications for iPhone and iPad, our specialists use Swift, the native language of the iOS mobile platform: reliable, intuitive and fast not only in development, but also in work on Apple devices.
Implementation of design and animations
At the time when BloggerMall came to us with a new project, the company already had a successful site made by Webnauts with a ready-made logo, bright corporate colors and a ready-made UI kit. Previously, our designers took part in the development of website design. Now the task is to design a mobile application for iOS devices.
Despite the fact that our first project assumed an adaptive design of the platform for any type of device, the design of the mobile application has its own characteristics. If the mobile version of the site looks almost the same as the site in a regular browser, then the design of the application must meet the requirements of the OS manufacturer for the user interface (in our case, the requirements of iOS). So the mobile application for apple devices will look “native”, and thanks to integration with the platform, it will work faster.
Based on the layouts developed in the Figma graphics program, our developer implemented and “revived” the pixel design of the application using the following technologies:
- Modal ViewController - bottom sheet modal view controller. This is a useful feature with a great UI/UX design that helps present a quick preview with minimal content.
- UINavigationControlleris a specialized view controller that manages navigation through hierarchical content. It is a navigational interface that allows you to effectively visualize data and make it easier for the user to navigate through this content. Simply put, the UINavigationController helps the application user remember where they are at the moment (name of the navigation bar) and how they can return to the previous screen (the built-in back button).
Animation plays an important role in mobile app design. It is designed not only to distinguish an IT product from competitors, but also to increase the usability of the application. Animation "reacts" to the user's actions and helps them quickly get used to it, making the process dynamic and interesting.
In the BloggerMall application, we animated interface elements such as a hamburger menu, buttons, registration fields, radio buttons and a bottom navigation (tab bar) with 3 main sections of the application (My Ads, Posts, Profile).
Animation of visual elements is implemented using the following technologies:
- Core Animation is a program developed by Apple for rendering, compositing, and animating images. It allowed us to deliver high frame rates and smooth animations without consuming the CPU or slowing down the application.
- Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time. Using animation with it is as easy as using static images.
Functional part of the iOS application
User registration and authorization
Registration and access to the application is possible both by entering an email and password, and by logging in through Facebook and Google.
The blogger registration process includes 6 steps, during which you must specify personal data and a password, information and blog topics, rates and a method of payment for advertising services.
01
/ 06
If you enter an incorrect password, the system offers the usual way to recover it via e-mail:
Registering an advertiser is easier and takes just 2 steps. To do this, you must fill out the form and accept the user agreement.
Blogger Profile
It contains several sections: Personal data, My Instagram account, Prices for my services, My payment card.
01
/ 08
Blogger's advertising account
Contains all information about advertising cooperation and includes 3 main sections: All advertising, In progress and Waiting. It allows you to control not only the status, terms and payment of advertising requests, but also quickly go to the chat with the advertiser to agree on the terms and details of the transaction.
Payment system
The principle of payment for advertising services on the exchange is as follows: after mutual confirmation of the order, the advertiser pays for the service from a previously linked bank card, and the funds are “frozen” on the platform (90% - payment to the blogger and 10% - exchange commission). After the advertiser has confirmed the successful completion of the order, the blogger receives his money on his bank card. In case of non-fulfillment of the order, the money is returned to the advertiser's account in full. Like on the site, all mobile payments are made using the UAPAY National Payment Service.
All of the above functionality of the BloggerMall application is implemented on the basis of API calls to the server side using technologies:
- UI Kit is a structured library of native components based on Apple guidelines. Thanks to interface elements grouped into categories (buttons, pop-ups, navigation bars, icons) and implemented in accordance with the apple design specification (typography, style, colors), UI Kit allows you to significantly speed up the creation of an application for iPhone and iPad.
- Alamofire is a Swift-based HTTP networking library for iOS and Mac OS X. It provides an elegant interface on top of the Apple Foundation networking stack that simplifies common networking tasks. Its features include chain methods of request and response, encoding and decoding responses, and data authentication.
Socket.IO technology was used to receive and send data between users of the BloggerMall application. It is a JavaScript library for real-time data exchange. It provides bidirectional, event-based communication between client and server with minimal data transfer delay.
Development of a messenger for an iOS application
Chat between users of the BloggerMall application was implemented using MessageKit technology, an open source Swift library for sending and rendering messages between users of iOS devices.
Perhaps the implementation of the chat was the trickiest task of the project. The server part of the messenger had previously been written for the BloggerMall website, and it should have been “transferred” to the iOS platform so that the principle of the chat was the same on the site and in the application.
But, as you know, it is easier (though longer) to write programs from scratch than to unravel someone else's code. And the use of third-party libraries can not always be clearly customized to the client's request.
Here the MessageKit technology helped, although not immediately, since our developer encountered it for the first time. At first, it was not entirely clear how to send, receive and compare data: not only text, but also large photo and video files. There were some difficulties with the design, namely with setting up the library and displaying the interface that the client requested. However, having gradually mastered the technology and figured out how the backend with the frontend works on the site, our iOS developer began to implement the messenger. As a result, we got both a convenient chat and an even more advanced specialist.
01
/ 04
The results
It took 2 months to create an iOS application, as a result of which BloggerMall received not only another source of income, but also the most thoughtful, understandable and reliable tool for effective cooperation between its clients: bloggers and advertisers. Analytics, advertising account, transaction history and internal chat - now everything is at hand for comfortable and safe cooperation. More satisfied customers means more successful transactions, and hence the growth of the company's income.
During this difficult project, we not only successfully implemented the product, but also replenished our technology stack. We love challenges, because they allow us to develop and make really cool things.
[post_title] => Mobile iOS Application for Bloggers' Platform [post_excerpt] => [post_status] => publish [comment_status] => open [ping_status] => closed [post_password] => [post_name] => mobile-ios-application-for-blogger-exchange [to_ping] => [pinged] => [post_modified] => 2023-09-14 16:57:09 [post_modified_gmt] => 2023-09-14 13:57:09 [post_content_filtered] => [post_parent] => 0 [guid] => https://wnauts.com/?post_type=project&p=11155 [menu_order] => 0 [post_type] => project [post_mime_type] => [comment_count] => 0 [filter] => raw ) [1] => WP_Post Object ( [ID] => 18997 [post_author] => 14 [post_date] => 2023-01-23 12:58:49 [post_date_gmt] => 2023-01-23 09:58:49 [post_content] =>- About the project and task
- The essence of the application
- Design and animation
- Mobile payment security
- Implementation on Android
- Implementation on iOS
- Application testing
- The summary
About the project and task
Metaverse VR Technology Ltd, a London-based company specializing in interactive leisure and business software, approached us to develop a mobile application for accepting POS payments via the Stripe bluetooth terminal. Not only mobile development in Swift and Kotlin, but also application design fell on our shoulders. When ready, the application had to be published on marketplaces for iOS and Android platforms.
The essence of the application
The principle of the program is to connect a mobile phone to the Stripe terminal via Bluetooth. After passing authentication, the client opens a convenient interface where they can specify the required transfer amount or select a product for purchase in the "Products" section. After that, the terminal receives and processes the data (location, amount and secret key of the client) and the money is debited from the bank card.
01
/ 04
Design and animation
Special attention was paid to the development of the design. The appearance of the application is distinguished by conciseness and simplicity. The white-green color scheme, the consistency of design elements and the absence of unnecessary details simplify (and therefore improve) the user's interaction with the business product in the field of payments.
Animation in mobile interfaces is indispensable. It not only enlivens the application, causing positive emotions, but also helps the user navigate it and get a response to their actions. The LottieFiles tool was used in the project implementation.
LottieFiles is a library for iOS, Android, Web and Windows. It consists of JSON files encoded with animation from Adobe After Effect. The plugin involved in creating such files is called Bodymovin. It has a JavaScript engine and renders animation in real time.
The Lottie tool greatly speeds up the mobile app development process.
Mobile payment security
Most users of mobile payment applications are concerned about the security of their personal data. Therefore, more and more developers are turning to a tool like Stripe. What can I say if such global companies as Shopify, MindBody and DocuSign have created an integration with Stripe technology to accept online payments.
Stripe is an international secure online payment system for Internet projects. The system is easily integrated into the site, has a clear payment interface, which is important for the conversion from an order to a purchase, and also allows you to build an entire payment infrastructure for your business. Stripe is distinguished by high speed of payment processing and security, and from a business point of view — very convenient means of integration with sites.
In our case, Stripe acts as an intermediary between the buyer and the seller, which makes a secure payment. Stripe solves all the problems of card payments, including data storage, recurring payments and withdrawals to a bank account. We used this technology in the development of the application for both Android and iOS.
Implementation on Android
Our developers have taken care not only about secure integration, but also about the high functionality of the application. In addition to the powerful and modern Kotlin programming language, many other technologies were used at certain stages of development:
- Data transfer to the server is implemented using Retrofit 2. This tool makes it easy to get and load JSON or other structured data through a REST-based web service. Retrofit uses the OkHttp library for HTTP requests.
- The database was created using PaperDb technology. This is a NoSQL-like storage for objects on Android that allows you to make and automatically process changes to the data structure.
- The application architecture was built using LiveData, a technology that stores data and associates objects with the life cycles of Android components.
- Work with fragments and animation was carried out using Jetpack Compose Navigation, a technology that allows the developer to set a navigation graph for transitions between screens via URI.
- The dynamic list was created using the RecyclerView library.
Also, to simplify the development of the application, Jetpack technology was used — this is a wide range of libraries and tools that help you write such code that will work the same on all devices and versions of Android.
Perhaps, with the development of an application on Android, that's it. We share with you the result in the form of a finished product:
Implementation on iOS
The application for "apple" devices is written in the Swift programming language developed by Apple.
The application architecture is made using the MVC (Model-View-Controller) programming pattern. Thanks to him, the logic of the entire application is divided into 3 main components:
- Model — responsible for the data logic which the application is based on;
- View — the visible part of the application which the user directly interacts with;
- Controller — the brain of the application, connecting the 2 previous components.
The user interface of the application is built using the UIKit library. It includes native Apple interface elements: widgets, checkboxes, progress bars, and navigation buttons. This technology streamlines the design process and saves development time (and therefore money for the client).
We used Alamofire to send and receive data. It is a library with an elegant interface and many features for developing modern applications using HTTP network requests.
Application testing
This is perhaps the most difficult part of the project, and now we will explain why. To test the application, we needed a Stripe terminal. But we did not have a terminal, and we had to give the product for testing directly to the client (which he was initially ready for).
Testing an application on Android became possible by generating a debug version of it in Android Studio — a compiled application that the client could easily install on his smartphone. We tested the iOS version using a special service from Apple Inc — TestFlight.
Bluetooth connection failure due to a long update of Stripe Terminal prevented us from getting closer to the release. After 15 test releases of the Android version and about 20 releases of the iOS version, we identified the cause of the bug, let the terminal “think” for 7 minutes, and the connection with the application finally took place.
Then we published the application in marketplaces and successfully passed moderation. This can be easily checked by entering the application name "Instant POS" in the Google Play Store or App Store search field.
The summary
To create an effective application in the field of online payments, we needed the expertise of a designer and two mobile developers, in addition to the organizational skills of an experienced project manager. As part of such a dream team, we managed to implement an affordable and at the same time highly functional mobile application for integration with a bluetooth POS terminal, with which you can easily and safely make money payments and transfers.
[post_title] => Mobile Application for Payment via Bluetooth-Terminal Stripe [post_excerpt] => [post_status] => publish [comment_status] => open [ping_status] => closed [post_password] => [post_name] => mobile-application-for-payment-via-bluetooth-terminal-stripe [to_ping] => [pinged] => [post_modified] => 2023-09-13 17:25:32 [post_modified_gmt] => 2023-09-13 14:25:32 [post_content_filtered] => [post_parent] => 0 [guid] => https://wnauts.com/?post_type=project&p=18997 [menu_order] => 0 [post_type] => project [post_mime_type] => [comment_count] => 0 [filter] => raw ) [2] => WP_Post Object ( [ID] => 20618 [post_author] => 14 [post_date] => 2024-03-10 17:51:35 [post_date_gmt] => 2024-03-10 14:51:35 [post_content] =>In the spring of 2022, we took part in the implementation of a startup by DiDiDo, a Kyiv-based network of gas stations, to create a mobile application for the delivery of diesel in bulk. The product is unique and has no analogs in Ukraine so far. All we had at the beginning was the customer's idea and logo. Therefore, we were tasked with developing an iOS and Android application for fuel consumers from scratch and preparing the product for release.
As part of this project, we also created an application for fuel truck drivers, which we describe separately in this case study:
Android mobile application for DiDiDo drivers
- The objectives
- UX / UI design of the application
- iOS application development
- Android application development
- The result
The objectives
The startup's goal is to create mobile applications that allow you to quickly and conveniently order diesel delivery in Kyiv and Kyiv region. To achieve this goal, we needed to:
- Create the interface design and clear application logic.
- Implement the application for iPhone and Android users.
- Integrate services for customer identification.
- Set up a cashless payment function.
- Implement the ability to automatically generate documents.
- Test and upload applications to marketplaces.
UX/UI design of the application
The web designer, together with the UX writer and project manager, thought through the ordering mechanics and designed pages at different stages of user interaction.
Registration / Authorization
After downloading the application from Google Play or the App Store, the user is greeted with a registration or authorization screen with password recovery functions:
Registration is possible in three scenarios, depending on the status of the client:
- natural person,
- individual entrepreneur,
- legal entity.
This is due to the rules for making cashless payments, which affects the form, content, and list of invoices that are automatically generated by the application after each order (waybill, expense note, and excise note). It should be noted that before each trip to the refueling point, the driver must print out the waybill generated on the basis of the customer's request. In addition, the customer enters into contracts with individual entrepreneurs and legal entities. Of course, we have taken all these subtleties into account in the development of applications.
1) Registration of an individual involves registration with an individual tax number. This information is required to identify the client and generate a delivery note and invoice. We are currently awaiting permission to implement the BankID technology, which will further facilitate the registration and authorization process and free users from the need to manually enter their tax number.
For individuals, payments are made using a personal bank card.
2) Registration of an individual entrepreneur, in addition to the tax number, requires additional information: the name of the bank and the IBAN account number. This is required for the automatic generation of a contract, a waybill, an expense note, and an excise note. The client is identified through the OpenData service for monitoring the registration data of Ukrainian companies.
Payment for services is made from the current account of the individual entrepreneur.
3) Registration of a legal entity also requires information about the tax number, bank name, and IBAN bank account. Again, verification is done through OpenData. By integrating this technology, we made it easier for the client to fill out the already long registration form, because when entering the EDRPOU (register code), the name, address of the company and the name of the head are automatically pulled up. After filling out the form, the application automatically generates the necessary list of documents (contract and invoices) for each order.
Legal entities pay for fuel delivery from their current business account.
We take care of the protection of users' personal data, so each stage of registration involves verification of the client's email, mobile, and tax number through a special confirmation code:
The user profile is quite minimalistic and contains several sections: "Profile", "Personal account", "Order archive", and "Instructions". Despite the fact that the application is automated, it has a "Support Service" and a "Call Us" function:
Making an application
You can order fuel in 2 ways: delivery or pickup.
Delivery
The service provides for the delivery of fuel within Kyiv and Kyiv region. In addition, delivery can be scheduled for a specific day and time:
When filling out an application, the customer indicates the number of drain points and the required fuel capacity, also they can pay for the order online and leave a review.
1) Ordering:
2) Waiting for the driver:
3) Refueling process:
What's more: the app also offers the ability to enter coordinates. A convenient solution to awkward situations when the customer-driver has neither fuel nor an idea of his location:
The delivery of fuel over long distances can be solved individually through an additional request:
Pick-up
The second method of ordering fuel — pick-up — is based on the principle of placing an order and booking the nearest fuel truck on the map in real time.
1) Ordering:
2) Pickup and refueling:
iOS application development
The iOS application was created for DiDiDo gas station customers using the Swift language.
The application's functionality is designed based on the MVC architectural pattern, which consists of 3 components:
- Model — responsible for storing, updating, and deleting data;
- View — responsible for displaying this data on the user's screen;
- Controller — responsible for the program logic and communication between the other two components.
The Alamofire framework was used to send and receive data, allowing requests to be made in the background without interfering with the application.
The design was recreated with pixel accuracy using the Figma graphics programme, which ensured a high quality display of the layouts in the real application.
The user interface was developed using the UIKit framework, which contains a set of elements (icons, buttons, tables, lists, etc.) in the Apple style.
The Lottie library was used to display animations in real time. Another framework — Core Animation — helped to create a dynamic and smooth interface, optimising the process of rendering visual effects and improving user experience.
The following frameworks were also used in the development of the iOS application:
- CoreData — for storing and managing data on users' iPhones, providing convenient access to data and improving application performance in the background.
- CoreLocation — to acquire and process geospatial data in the application, i.e. to determine the exact location and monitor the movement of the user's device.
- SocketIO — for two-way, real-time communication between the browser and the server.
- PushNotification — for sending push notifications about new orders, refuelling, etc.
Google services came in handy during the development of the app:
- Maps — for geolocation of devices of users using the application;
- Firebase — for real-time push notifications.
Android application development
We used the Kotlin language to develop our applications, which is known for its cross-platform capability, i.e. the ability to run on different operating systems: Android, iOS, macOS, Windows, Linux, etc.
When designing the architecture of the Android application, we used the MVVM (Model-View-ViewModel) pattern, which, like the aforementioned MVC, divides the application into 3 functional parts. The difference is that MVVM has more flexible logic and wider possibilities for structuring the application.
The interactive user interface is created using the Jetpack Compose framework, which is compatible with Kotlin and allows you to easily change the styles and themes of the application.
The Retrofit 2 framework and the Socket.IO library provide reliable communication between the client and the server without high latency and load on the application.
The animation effects were created with the help of the Lottie library. Other libraries were also used:
- AndroidX — to improve the functionality of the application on Android devices of the latest versions;
- Coil — for downloading and caching images;
- Work Manager — for scheduling and performing tasks in case of application or device failure;
- Room — for effective interaction between the application and the database.
Payment for fuel delivery is made through the app's integration with the LiqPay service.
In addition to the already mentioned Google services Maps and Firebase, the Places API tool was also used. It greatly expands the application's ability to interact with geospatial data, allowing you to find locations by address, coordinates, or name and get additional information about them.
The result
We've talked a lot, so let's give you the chance to see the result for yourself. Or rather, two results. Download the apps from Google Play and the Apple Store and use them to your heart's content:
[post_title] => Mobile application for iOS and Android for diesel delivery [post_excerpt] => [post_status] => publish [comment_status] => open [ping_status] => closed [post_password] => [post_name] => mobile-application-for-ios-and-android-for-diesel-delivery [to_ping] => [pinged] => [post_modified] => 2025-08-13 13:06:33 [post_modified_gmt] => 2025-08-13 10:06:33 [post_content_filtered] => [post_parent] => 0 [guid] => https://wnauts.com/?post_type=project&p=20618 [menu_order] => 0 [post_type] => project [post_mime_type] => [comment_count] => 0 [filter] => raw ) )Worked on
-
Mobile iOS Application for Bloggers’ Platform
-
Team:
4
-
Cases:
0
-
Reviews:
0
-
-
Mobile Application for Payment via Bluetooth-Terminal Stripe
-
Team:
2
-
Cases:
0
-
Reviews:
0
-
-
Mobile application for iOS and Android for diesel delivery
-
Team:
5
-
Cases:
0
-
Reviews:
0
-