Smartphone-based colorimetric sensor application for measuring biochemical material concentration Sensing and Bio-Sensing Research

In this paper, colorimetric analysis for biochemical samples has been realized, by developing an easy-to-use smartphone colorimetric sensing android application that can measure the molar concentration of the biochemical liquid analyte. The designed application can be used for on-site testing and measurement. We examined three different biochemical materials with the application after preparation with five different concentrations and testing in laboratory settings, namely glucose, triglycerides, and urea. Our results showed that for glucose triglycerides, and urea the absorbance and transmittance regression coefficient (R 2 ) for the colorimetric sensing application were 0.9825, and 0.9899; 0.9405 and 0.9502; 0.9431 and 0.8597, respectively. While for the spectrophotometer measurement the (R 2 ) values were 0.9973 @560 nm and 0.9793 @600 nm; 0.952 @620 nm and 0.9364 @410 nm; 0.9948 @570 nm and 0.9827 @530 nm, respectively. The novelty of our study lies in the accurate prediction of multiple biochemical materials concentrations in various lightning effects, reducing the measurement time in an easy-to-use portable environment without the need for internet access, also tackling various issues that arise in the traditional measurements like power consumption, heating, and calibration. The ability to convey multiple tasks, prediction of concentration, measurement of both absorbance and trans- mittance, with error estimation charts and (R 2 ) values reporting within the colorimetric sensing application as far as our knowledge there has not been any application that can provide all the capabilities of our application.


Introduction
Recent advancements in smartphone technologies enable multiple scientific disciplines to apply this technology in serving their needs. Labon-Chip (LoC) is increasingly used to rely on smartphone sensors to make on-site laboratory testing, measurement, and diagnostics [1]. Smartphone complementary metal-oxide-semiconductor (CMOS) camera is a big resource for information gathering and with the help of smart applications for image processing and data analysis, the concept of rapid testing has been realized [2]. Traditional laboratory techniques for testing and diagnosis of analytes by bulk instruments and devices with careful specialists are still in place, however, designing smartphonebased instruments and applications is rising significantly in recent years this is due to many factors such as easy-to-use applications, portability of the whole system, cost-effectiveness, easy-manufacturing, rapid testing and diagnosis, an extremely comparable performance which allows the functionality in rural areas and thus makes the smartphone-based approach more convenient in many cases [3].
Usually, there are two approaches to tackle the problem of diagnosis and testing, one is based on designing both hardware and software components to establish a strong link between them and get a reliable result. While the other approach involves just developing the software for the smartphone to analyze the different aspects of the image and perform the required processing as we present here in this article [4,5]. Biochemical materials, nanomaterials, and hazardous materials were investigated, analyzed, and tested with the smartphone-based approach to naming a few, glucose [6][7][8], c-reactive protein [9], gold nanoparticles [10], nitrite [11,12], chromium [13,14], iron [14], mercury [15]. The concentration measurement is a key element in characterizing the material behavior, for example, in environmental protection, usually, the materials should be at a certain level of concentration when this exceeds the appropriate amount it leads to hazardous situations such as poisoning, fatigue, and death of certain species. Many materials show a colorimetric behavior when prepared for a certain concentration and this concentration is marked somehow into the intrinsic color produced by the material under a certain concentration, sometimes naked eyes can distinguish between certain levels of concentration due to color change, but in most cases, it is hard to predict the concentration with naked eyes. The solution is to analyze the color of the material by introducing image processing and smart applications this is the concept of colorimetric analysis [16][17][18]. Alternative approaches can be based on fluorescence [19], chemiluminescence [20,21], luminescence [22], phosphorescence [23] and bioluminescence [24]. In 2014, Ruiz, et al., [12], used image processing and android mobile application to calculate nitrite (mg.L − 1 ) concentration based on HSV (Hue, Saturation, and Value) color model for paper microfluidic devices. Also, Hong and Chang [25] developed a mobile application for colorimetric sensing of multi-analyte arrays. The smartphone identifies the position of the sensor then the colors measured at each sensor are digitized based on a correction algorithm; leading to concentration values by pre-loaded calibration curves. Additionally, Firdaus, et al. [14] used two methods for digital image colorimetry to determine the concentration of iron and chromium materials, the methods were for postprocessing the images in MATLAB namely, simple linear regression for an individual (Red, Green, and Blue) RGB channel and partial least square for all channels of RGB image. In 2015, Jung, et al., [26], detected saliva alcohol concentration using Smartphone-based colorimetric RGB and HSV analysis. They used separate channels of color intensity values for Ethyl alcohol concentration in percentages. In 2017, Mutlu, et al., [27] used a machine learning algorithm in smartphone-based colorimetric detection of pH values with different types of images JPEG, RAW, and RAW-corrected. Their approach is applicable for paper-based colorimetric assays. In 2018, Guo, et al., [28], designed a 3D smartphone adapter for colorimetric sensing of formaldehyde, using the images for different formaldehyde concentration samples, their results focus on the color ratio of the reaction region. The formaldehyde concentrations were in ppm (part per million) that were plotted against the color ratio for different concentrations. They used individual color channels to show their results, the red, green, and blue channels. Also, Soni, et al. [29] developed a smartphone-based handheld optical biosensor for the determination of urea in saliva. The sensitivity reported was − 0.005 average pixels sec − 1 / mgdL − 1 with a (limit of detection) LOD of 10.4 mgdL − 1 . In 2019, Zhong, et al., [10] developed a smartphone-based colorimetric sensor with a combination of gold nanoparticles and enzyme-linked immunosorbent assay (ELISA) technique on a 3D portable adaptor to detect saxitoxin poison in seafood. They present their result as individual channels of RGB images from the ELISA kit. In 2020, Xing, et al. [21] developed a dual-functional smartphone-based sensor for colorimetric and chemiluminescence detection. In colorimetry, five analytes that display different colors and various intensities were detected sensitively while in chemiluminescence H 2 O 2 was detected successfully. They created a smart application that allows testing and sharing of fluoride quantification results with a 3D printed smartphone adapter for RGB image detection and processing.

Materials and methods
We used the following biochemical materials, glucose (BioSystems Co., 11,503, Barcelona, Spain), triglycerides (Agappe Diagnostics, 11,410,103, Cham, Switzerland), and urea (BioSystems Co., 11,536, Barcelona, Spain) control samples with five different concentrations, resulting in fifteen total samples, as shown in Fig. 1 Where: C 1 : Original concentration; V 1 : Original volume; C 2 : Prepared concentration; V 2 : Prepared volume. We measured the sample transmittance (T) and absorbance (A) with a spectrophotometer (Chongqing Gold Mechanical & Electrical Equipment Co., Ltd., GD-725, Chongqing, China), and for each measured value of sample absorbance and transmittance we compute the other value to check for the error of measurement using Eqs. (2.a) and (2.b) below: And since the absorbance is equal to [2]: Where: ε(λ): Molar absorptivity; b: Sample length; c: Sample concentration, and Since [2]: Combining Eq. (3) with (4), we get: Where: I 0 : Background intensity of the RGB colored image; I: Sample intensity of the RGB colored image. The absolute average error percentage (err%) between measured quantities of transmittance and absorbance for the sample is calculated as shown in Eqs. (6.a) and (6.b) Where: n: Integer; N: Number of samples; the subscripts M and C denote the measured and calculated quantities respectively. We can compute sample concentration in the developed Android application (Colorimetric Sensing) in two different units, mg/dL and (mM) using these formulas for glucose Eqs. (7.a) and (7.b), for triglycerides Eqs. (7. c) and (7.d), and for urea Eqs. (7.e) and (7.f).  The Colorimetric Sensing computes the intensity values based on the RGB images for both background and sample following Eq. (8).
Where: the subscripts 0 , and S represent the background and sample, R: Red channel; G: Green channel; B: Blue channel of the RGB image. Then we can estimate the error of computation which gives us the regression coefficient (R 2 ), which serves as the measurement accuracy factor, the experimental setup is illustrated in (Fig. 2).

Experimental work
Here we will discuss the developed application, the application can proceed in two different workflows A and B. (Fig. 3) shows the application workflow A and B. We designed and implemented an Android application, that we will call "Colorimetric Sensing", using the latest version of Android Studio (4.0). The role of the application is to implement the equations provided in the Material and Methods section (Eqs. (2)-(8)) but offering a user-friendly interface. Colorimetric Sensing was written in Kotlin and was tested successfully on a Huawei Mate 20 Pro (Huawei manufacturing, China). Fig. 4 shows the two workflows that the user can follow for generating results: the first one, workflow A, allows to use of the same background image for all the samples, the second one, workflow B allows the user to choose it for every trial of sample measurement. We now describe workflow A, then workflow B will easily follow from that. (1) The user creates a new session (Fig. 4a), the session can be considered as a container of all samples of the same type, for this reason when creating it the user must choose the material of interest, its absorptivity, and the linear fit when needed. The user can choose from a fixed list of materials that we implemented from the "Handbook of Laser Dyes" [30] but he can also manually provide the material metadata. In this workflow, the user is now asked to choose the background image that will be used for all the samples in the session. (2) Once the user has created a session, he can start to add samples, so he opens the session dashboard (Fig. 4b) and adds a new sample (Fig. 4c). The sample image can be either already in the smartphone storage or it can be taken instantaneously from the smartphone camera. After choosing the image, the user chooses (3) the area of the image that will be used for the analysis, this area will be forced to be of the same size as the previously selected background, in order to avoid bad concentration predictions due to different image resolution. After the image selection, the user can immediately see the concentration predictions (in two units: molar concentration (Mol.) and milligram per deciliter (mg.dL − 1 ) using the conversion formula (7.a and 7.b), the RGB difference between the background image and the sample image and also input a value for the sample length (if it is not matching the standard 1 cm). Finally, after processing many samples of the material, the user (4) can see the absorbance, transmittance, and error estimation curves inside the application with the value of the regression coefficient (R 2 ) is indicated for both curves of absorbance and transmittance with linear approximation curve and the points represent the actual data collected by the application (see Fig. 6b). Moreover, the application also draws prediction error charts if the user wants to compare them with a laboratory device.

Results
The transmittance, absorbance, and the absolute average error curves for glucose (350-640 nm), triglycerides (400-680 nm), and urea (500-780 nm) with concentrations of (100, 200, 300, 400, 500 mg/dL) for glucose and triglycerides, while the urea concentrations were (10, 30, 50, 100, 150 mg/dL) are shown in the supplementary materials (Figs. S.2, S.3, and S.4). Trials of glucose, triglycerides, and urea were conducted for each material, we captured 3 high-resolution photos that were processed and a fourth trial was made by changing the background of the third photo for all materials to establish both application workflows (A) and (B) (Fig. 3). The number of trials was 15, in each trial, the position of the selected portion of the image differs slightly and thus making a change in the absorbance reading and thus the concentration estimation in the app. The overall number of trials for all materials in all images was 900 trials. We used both the absorbance and the transmittance for convenience, as shown in (Fig. 5) where background image, samples, concentration estimation, plots of transmittance and absorbance for all samples versus concentration in two different units, the error of measurement bar chart and the linear regression coefficient (R 2 ) for both A and T is depicted by the colorimetric sensing application. (Figs. 6 and 7) show the absorbance and the transmittance curves for the glucose, and triglycerides materials both calculated in the colorimetric sensing application and measured in the spectrophotometer, respectively.
( Fig. 8) presents the absorbance and the transmittance curves for the urea material both calculated in the colorimetric sensing application and measured in the spectrophotometer.

Discussion
Our approach in this study was a mixture of laboratory measurements of the biochemical materials, glucose, triglycerides, and urea (see  Fig. 1 and Fig. S.1 (in the supplementary material)). In addition to using the developed colorimetric sensing application for testing and measurement (see Figs. 4 and 5). The prepared concentrations of all the samples reported here were control samples. For triglycerides, the use of a wide range of concentrations is due to the fact that in 100 mg/dL concentration is a normal value of triglycerides concentration in human, a 200 mg/dL concentration is a borderline high level, 300 mg/dL and 400 mg/dL are high levels, finally, 500 mg/dL is very high level. These high levels come from certain conditions including obesity, low thyroid hormones, diabetes with poor control, liver and kidney diseases, alcohol consumption, and poor diet. A rare case of 10,000 mg/dL was found in the literature [31] also this justifies the use of the high concentration levels [32][33][34][35]. We took into account many variables that may arise from dealing with the images of the biochemical materials. The images were  taken by Xiaomi Pocophone F1 (12 Mpx) under different lighting circumstances, with flash, reflection, and without flash to estimate the best available environment for concentration measurements. The designed application here can overcome different lighting conditions of the samples by inserting the fitting parameter to the application, in which, the molar absorptivity can be calibrated regardless of the illumination light type. This is shown as in Fig. 1, different lighting parameters were chosen to check for the practicality of the application to predict the concentrations of the materials under different lightening circumstances, so even when different environmental lighting is the case, the application by simple calibration of the data can overcome this issue. Therefore, discussion of different LED sources and CMOS camera characteristics are not the case, since the application work by simple calibration with a priori determined concentration values, and then the application can predict the unknown concentration of the material. To put it in different words, we can say that in order to accurately predict the concentrations of unknown samples, first, a known value must be at hand and then calibrated for the unknown material. And since we are developing the application from scratch with no previous data at hand, we are making the prediction goes more automated by the application by loading data into the application in which the application can predict the unknown concentrations with high accuracy. The colorimetric sensing application can work with more materials other than just the three materials reported here. So, we used the handbook of laser dyes [30] to add all the materials that are discussed by the handbook into the application library for potential use in other samples. This is to justify that the application can be preloaded with actual measured molar absorptivity data and also can be calibrated for other data. And since we could not find detailed and trustworthy information about the materials that we are using in the manuscript, we worked by calibration and known concentration approach. The images taken were high-resolution images with a pixel size of (without flash 960 × 540) and (with flash 528 × 960) therefore the estimation of the concentration was close to the actual concentration. We verified the laboratory measurement based on Eqs. (2.a) and (2.b)) after preparation with high accuracy of the material concentration in laboratory settings. The laboratory measurements were done in the visible region of the spectrum; for glucose λ = (350-640 nm), triglycerides λ = (400-680 nm), and urea λ = (500-780 nm). We provided the error of measurements based on comparing each recorded value for absorbance and transmittance with the equation-based value (2.a and 2.b) of the measured quantity. The error was marginal as shown in the supplementary material (see Figs. S.2c, S.3c, and S.4c). The absorbance and transmittance curves show the one-toone mapping of the measured concentration, with a linear increase in absorbance and linear decrease in transmittance for all inspected materials (Figs. 6, 7, and 8). For the designed application, we examined different circumstances, for example, we took into account the selected area of image processing to be the critical issue since in each trial of computation when choosing the material this area is subjected to minor deviation, and thus careful choice should be made when dealing with the samples. The nature of the processed images in terms of lightening is also important and we considered it when designing with the application, by taking three different scenarios of image lightening (with flash, with flash, and reflection, without flash) (see Fig. 1). Finally, the background image choice is subjected to an accurate selection of the position of the pixels and cropped image size, we provided the opportunity in the colorimetric sensing application to deal with background images in two different ways. The workflow (A) with single image background for all samples provides a solution for image comparison by subjecting all samples to the same background, this eliminates the need for background image set up every trial, reducing the error of measurements, and provides faster image processing resulting in a rapid testing environment by reducing the processing time of concentration measurement. On the other hand, workflow (B) with background image for every trial is useful in other cases, for example, when the user prepares the samples in different timeframes or different lightening and positioning of the cuvette, this results in changes in the background image, thus, the workflow (B) solves the issue with high accuracy. The results were promising since we get for the colorimetric sensing application a linear regression coefficient (R 2 ) values for absorbance and transmittance for glucose, triglycerides, and urea 0.9825, and 0.9899; 0.9405 and 0.9502; 0.9431 and 0.8597, respectively (see Figs. 6.a, b, 7.a, b, 8.a, and b). While for the spectrophotometer measurements the (R 2 ) of the absorbance and transmittance with the same material flow was 0.9973 @560 nm and 0.9793 @600 nm; 0.952 @620 nm and 0.9364 @410 nm; 0.9948 @570 nm and 0.9827 @530 nm, respectively (see Figs. 6.c,d,7. c,d,8.c, and d). These results indicate a very good linear behavior and the estimation of the concentration for the materials was valid (>0.9 [5]) for testing purposes. The linearity of the samples in a laboratory setting is different from the linearity of the image processing. A spectrophotometer analyzes the transmittance and the absorbance as the measurement of the transmittance and/or absorbance by adjusting a specific wavelength to the sample with a blank sample for calibration, these measurements use the beer's law Eq. (3). However, image processing is the basis of the application and the linear response in image processing comes with more computational complexity than with laboratory instruments used. Due to the promising results from plasmonic nanosensors, we dedicate future efforts to merge both hardware implementation with the reported software here to investigate further advancements in the smartphone sensing environment [36]. The colorimetric sensing application provides highly compatible concentration measurements of the materials in comparison with the laboratory spectrophotometer. The novelty of our study lies in the accurate prediction of multiple biochemical materials concentrations in various lightning effects, reducing the measurement time in an easy-to-use portable environment without the need for internet access, as the colorimetric sensing application does not require feedback from the data center for concentration measurement, also the novel approach of incorporating powerful software to tackle various issues that might arise in the traditional measurements like power consumption, heating, and calibration. The ability to convey multiple tasks, prediction of concentration, measurement of both absorbance and transmittance, with error estimation charts and R 2 values reporting within the colorimetric sensing application as far as our knowledge there has not been any application that can provide all the capabilities of our application. For comprehension (Table 1) shows a comparative analysis of the relevant literature with different approaches to the concentration calculation. As indicated in (Table 1) no study has reported both absorbance and transmittance with three different biochemical materials and a comparison with a spectrophotometer for reference, besides, our compatible and reliable prediction of the concentration is very compelling. We intend to progress our research by adapting the whole sensor system composed of the smartphone 3D printed adapter with lenses, filters, and both light-emitting diodes (LEDs) and Lasers as illumination sources.

Conclusions
The colorimetric sensing application developed here can be a good candidate for a variety of biochemical materials that enable the interested users to perform rapid testing and measurement of material concentration based on the simple image capturing of the carefully prepared samples. We believe that continuing this approach is of interest to rapid test, measurement, detection, and diagnosis studies that rely on the concept of colorimetry. The efficiency and reliability of the colorimetric sensing application with high accuracy concentration prediction is a promising application that can benefit researchers worldwide.

Declaration of Competing Interest
The authors have declared no conflict of interest.