SVIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY UNIVERSITY OF INFORMATION TECHNOLOGY NGUYEN DUC THONG THÁI — 19522188 LE THI KIM CHI - 19521283 GRADUATION THESIS AI-BASED HAIRSTYLE APPLICATION FOR BARBERSHOP BACHELOR OF ENGINEERING IN INFORMATION SYSTEMS TP. HO CHI MINH, 2023 VIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY UNIVERSITY OF INFORMATION TECHNOLOGY ADVANCE PROGRAM IN INFORMATION SYSTEM NGUYEN DUC THONG THAI — 19522188 LE THI KIM CHI - 19521283 GRADUATION THESIS AI-BASED HAIRSTYLE APPLICATION FOR BARBERSHOP BACHELOR OF ENGINEERING IN INFORMATION SYSTEMS THESIS ADVISOR PH.D NGUYEN THANH BINH TP. HO CHI MINH, 2023 ASSESSMENT COMMITTEE The Assessment Committee is established under the Decision. by the Rector of the University of Information Technology.
¬ cece eee ne eee e eee na een ens — Chairman. tee ene tee ene ene ene ened — Secretary. cent ee tenet nena e nena naa — Member TABLE OF CONTENTS CHAPTER 1 : INTRODUCTION WVCADO3nNY) 1.1 The need of the subject 1.4 Expected result CHAPTER 2 : REVIEW OF LITERATURE 2.1 Current Hairstyle changing applications.2 Hairstyle transfer approaches CHAPTER 3 : BACKGROUND KNOWLEDGE eF=KYNcRPWHaDwBOoA 3.1 Language and Framework 3.2 Python with AI Hairstyle 3.3 Comparing Pytorch with TensorFlow 3.2 Core concept of ReactJS 3.3 ReactJS with AI Hairstyle 3.2 Core concept of NodeJS 3.3 Nodejs with AI Hairstyle 3.4 Comparing NodeJS with other frameworks 3.2 Core concept of MongoDB 3.3 MongoDB with AI Hairstyle 3.4 Comparing NoSQL with SQL 29 3.3 Tools and Utilities 30 3.1 About Android Studio 30 3.2 Android Studio with AI Hairstyle 31 3.4 Generative adversarial network (GAN) 32 3.1 Introduction to GAN 32 3.2 How do GANs work? 32 3.3 GAN with AI Hairstyle 36 CHAPTER 4 : OUR SYSTEM ANALYSIS AND DESIGN 37 4.1 Al approach for AI-HairStyle-Engine 37 4.3 Processing steps in detail 40 4.2 Target Hair Alignment 42 4.2 System Analysis and Design 51 4.1 Design system architecture 51 4.2 Main using flow 54 4.1 API for Hairstyle 58 4.2 API for Admin 58 4.5 Design use case diagrams 59 4.6 Design activity diagrams 60 4.7 Design sequence diagram 62 4.8 Design Interface 67 CHAPTER 5 : IMPLEMENTATION AND DEPLOYMENT 76 5.1 Client — Mobile Application UI 76 5.2 List of Hairstyles 77 5. Homepage after choosing hairstyle and taking an image 82 5.2 Hairstyle management screen 86 5.
Update hairstyle screen 87 5. Deleting a hairstyle screen 87 5. Add hairstyle screen 88 5.4 Backend 92 CHAPTER 6 : CONCLUSION 95 6.1 Comparison with other approach 95 6.2 Challenge and methodology 98 6.1 The problem of GAN inversion 98 6.3 Future work 100 REFERENCES 101 LIST OF FIGURES Figure 1-1. Output of application Hair Makeove.
An example of AI-Hairstyle application. a) Input a picture of a user. b) Hairstyle was chosen by the user. c) Output of AT-Hairstyle application that is user in figure 1-2a after applying hairstyle 1-2Ö.- --- «5 s13 1E HH ng ng ng kg 3 Figure 2-1.
Feedback of some current Hairstyle transfer applications. Result of some current hairstyle transfer applications. a) original image, b) Hairstyle Try On, c) Hair try-on — hair-styling, d) Hair Makeover application. Survey popular of active SOÍYWAT.- Gà HH TH ng ngư, 13 Figure 3-2.
Example of components in ReactsS .- -- 5 c5 kg re 19 Figure 3-3. Example of JSX clement ccc eee escesceseneeneceesesseeseeseeeeeesesseeeeaeeaeeaes 19 Figure 3-4. Example of Props in ReaCtJS. Example of Event Handling in ReactJS ooo.
ee csesessceseeeeeeeneeeeeneeneeseeaes 20 Figure 3-6. General architecture Of GATN.- LH HH TH ngư 32 Figure 3-7. Min-Max GAN loss ÍUnCfIOH.- -ó- G1111 211v TH ng ry 33 Figure 3-8. Training the discriminator to distinguish between fake images generated by the generator and real images using Backpropagation algorithm.
Training Generator to generate fake images with feedback from Discriminator using Backpropagation aÏØOTItHIT. An overview of the framework proposed in [1] - StyleYourHarr, which is used in our AI Hair Engine. Initially, we acquire wsrc, wtrg, and Fsrc by embedding both a source and target hair image into the W+ and FS spaces. Subsequently, we fine- tune wtrgto align with the source pose, yielding wtrgalign Using the segmentation mask of the aligned target hair, we determine wsrcinpaint , which handles the inpainting of source occlusions.
Finally, we combine Fsrc, wsrcinpaint, and wtrgalign to produce the high-quality OUtPUL. Visualization of GAN inversion: In contrast to the typical procedure of sampling and generating with a trained generator G, GAN inversion involves mapping a provided real image x to the latent space, resulting in the acquisition of the latent code. Reconstruct an image from random latent Code Z. Latent code optimization Process.
Reconstructed image is improved throughout epochs. After epoch 1000, the reconstructed image looked the same with the input 11aøØe. Target hair alignment phase of the proposed framework in [1]. The algorithm derives the aligned latent codes for the target hair, wtrgalign, through optimization of the initial m vectors within wtrg.
This optimization process ensures that these vectors adopt the source pose while maintaining the original ha1rstyÌe. Local-style-matching loss [1]. While aligning the target hair, the algorithm incorporates a local-style-matching loss, which is employed on style regions found in both the target hair and the aligned target hair. The style regions are delineated by white boundaries, and the red-bordered regions illustrate an instance of a style region that is consistently fraCK€C.- s11 1H HT HH TH HH nh 45 Figure 4-8.
Generation of an objective label [1]. When it comes to source inpainting, the algorithm establishes an objective label known as S srcobj. This label serves as a reference to direct the process of filling the occluded regions with appropriate semantic 02011 | ot | DD 3 5 RS Ol 47 Figure 4-9. (a) The w vectors derived from the earlier stages are mixed with the fine-tuned blending weight wweight to produce wblend.
(b) Following this, we merge F trgalign, Fblend, and Fsrc with their respective masks to form Ffinal. (c) F final and wblend are then input into the StyleGAN2 generator to generate the final output. (d) The blending loss is comprised of three components: L perceptkeep, A percepthair, and L perCe€thQÏT. AI-Hairstyle pipeline .-- - --- c5 11 SH HH HH kh, 51 Figure 4-11.
AI-Hairstyle system arChIt€CfUTC. Main using flow for our mobile client appÏication. API structure đ1aØTaIm. - -- c1 331135111211 193119 111111191 HH TH như, 57 Figure 4-14.
AI-Hairstyle use case đIaØTAI. --- - - G1111 HH re, 59 Figure 4-15. Activity diagram for users (Mobile UUÏ).- -- 5 - + + +sk+seeksseeseeeeee 60 Figure 4-16. Activity diagram for adIm111.
Sequence diagram for generating hairstyle (Mobile client U]). Sequence diagram for searching hairstyle (Admin U]). Sequence diagram for inserting a new hairstyle (Admin UỊ). Sequence diagram for updating hairstyle (Admin UD).
Sequence diagram for deleting hairstyle (Admin UI). Wireframe of mobile UI homepagỹe.-- --- -- ¿+ +s + ++x£+sE+eE+sereeeseerserse 67 Figure 4-23. Wireframe of hairstyle Ï1Sf. Wireframe of confirming image SCT€€T.
Wireframe of result SCT€€TA.-- 5 5 211 1 TH nh HH ngư nên 71 Figure 4-26. Wireframe of share image SCT€€I1. Wireframe of Login page (admin pOrfaÌ).- --- + «++s+++++s+se+se+ 73 Figure 4-28. Wireframe of hairstyles list (admin portal).
--- --- «<< £+s++ecz+sx+s 74 Figure 4-29. Wireframe of adding hairstyle form (admin portal). Homepage of mobile UI, users can choose hairstyle by clicking on the second button (2), and take image by clicking on first button (1), and generate image by clicking On the third button () .-- (211 2111111665388 1111111111119 1111 003111111 11kg vn yy 76 Figure 5-2. List Of hairstyle SCT€€TNS.- G2 S2 9211121113111 11 811191 11 HH ngư, 77 Figure 5-3.
Search hairstyle SCreen. -- - G11 HH gi 78 Figure 5-4. Taking image SCT€€IN. Detecting image SCT€H.- - -G G n1 TH HH HH ky 80 Figure 5-6.
Confirm image SCT€€T.-- G1231 1911 910 E911 9011111 HH HH ky 81 Figure 5-7. Homepage after choosing hairstyle and taking image of users' face. Result screen and QR code for users to download their image. Administrator login page.- ---- - 5 11111112111 111911191 HH Hy 85 Figure 5-11.
Hairstyle management SCT€€TI. Update hairstyle SCT€€TN. -- G3 1391119111931 5 1111111 HH thư, 87 Figure 5-13. Delete hairstyle Screen 0.
ee es eeceeseesecesesseeeseeseecessecscesseseeeeeeaeeaeseeeeaeeeees 88 Figure 5-14. Adding hairstyle SCT€€TI.- (G5 1231991 931991 911 01 vn ng ng nh 89 Figure 5-15. Loading screen while the server processes the request. Deployment of Administration Íront-enid.- --- --«- ««+sx£+s+seeseeeseess 90 Figure 5-17.
MongoDB database InfOrmatiOT.-- eee eseeeeeeceeeeeeseeeesesseeseeseaeees 91 Figure 5-18.- - 6 s11 91 90191 HH HT HH nh 92 Figure 5-19. Server's CPU 1nÝOTIafIOTI.- 6 5 111191 230191 911 01 0v ng ghi nr 93 Figure 5-20. Server's RAM InÍOTIAfiOT.-- 6 5 6 31918231 1 911 1 91 0v ng nh 93 Figure 5-21. Server's GPU InfOrTmatiOT.
«+ + 3 23 21123 1 1 TH HT ng rệt 94 Figure 6-1. Compare generated images of Barbershop and StyleYourHarr (1). Compare generated images of Barbershop and Style YourHair (2). Our distributed GAN inversion approach.cceeeeeseescceeceeeneeeteeeeeeseaeeeeeeee 99 LIST OF TABLES Table 3-1.
Comparison between Python and TensorFlow. Comparison between NodeJS and other framewOorKsS. Comparison between NoSQL and SQL. Structure of Hairstyle €OlÏ€CIOHI.
Structure of Admin COÏÏGCfÏOTA. API for sr1. API for ÀAm1Ti. 7 5 1119119119101 1 900111 HH nh ng nry 58 Table 7-1.
We measured FID score for Barbershop and StyleYourHarr framework on hairstyle transfer task. ceceeseesceseeseceseeeceseeececeesecceeseceeesecseessecsecesecseceseeseeeeesaeeeeeeaees 95 ACKNOWLEDGEMENTS I would like to extend my heartfelt gratitude to the individuals who have played pivotal roles in supporting and guiding me throughout the completion of this thesis. First and foremost, my sincere appreciation goes to Dr. Nguyen Thanh Binh for his unwavering commitment to this project.
His invaluable technical guidance and insightful contributions have significantly enriched the quality of this thesis. Binh's dedication and mentorship have been instrumental in shaping the direction of my research, and for that, I am truly thankful. Furthermore, I would like to express my gratitude to all the esteemed teachers at the University of Information Technology — Vietnam National University, Ho Chi Minh City. Their profound knowledge, engaging teaching methods, and continuous support have been integral to my academic journey.
The lessons imparted by these educators have not only deepened my understanding of the subject matter but have also inspired and motivated me to strive for excellence. In acknowledging these individuals, I recognize that their collective efforts have played a crucial role in my academic and research endeavors. I am truly fortunate to have had the privilege of learning from such dedicated mentors and educators, and their impact on my scholarly pursuits is immeasurable. Ho Chi Minh City, December 28, 2022 Author team.
ABSTRACT In the fast-paced and ever-evolving landscape of the contemporary era, personal style and self-expression have taken center stage. The growing demand for beauty has become increasingly essential, evident from the rising number of hair salons not only in Vietnam but also around the world. To cater to hair salons and users, we proudly present AI Hair Style, a revolutionary system. At its core lies an innovative and user-friendly mobile application designed to transform how people explore, experiment, and transform their hairstyles.
This cutting-edge app boasts a powerful feature - "Change Hair Style" - offering users a comprehensive and personalized hair styling experience. Leveraging the support of AI, the app goes beyond mere virtual styling and proposes high-quality looks that users can envision as real-life transformations. Embrace the future of hairstyling with AI Hair Style, where creativity meets technology for the ultimate hair journey.1 The need of the subject As a result of the growing development in life and demand for beauty, the harshness of user aesthetics increases in proportion to the cost and competitiveness of the beauty service market, so trying a hairstyle like trying other items or pretesting clothes is essential. However, many applications support users to try hairstyles like Virtual Hairstyle, Hairstyle Changer, and Hair Makeover.