Optical probing of DC/DC converter voltages for sequencing verification Bachelor Thesis in Electrical Engineering Arvid Karlsson Awaz Nabi Pour DEPARTMENT OF ELECTRICAL ENGINEERING CHALMERS UNIVERSITY OF TECHNOLOGY Gothenburg, Sweden 2023 www.chalmers.se http://www.chalmers.se/ Abstract The purpose of this project is to develop an application that can verify start-up and shut-down sequencing of DC/DC converters and that can be downloaded on a mobile phone for Ericsson employees to use on their company provided phones. It was concluded that a combination of using JavaScript together with HTML and CSS was the best way to create a program that can measure pixel values of LEDs on probe opto-modules. The probe opto-modules are placed on the circuit board by the user and then recorded during start-up and shut-down. To acquire accurate values from the recorded videos the super slow-motion camera feature, with a frame rate of 960 FPS, on a Samsung S22 mobile phone was used. Due to storage limitations on the phone, the video could only be recorded for about 0,5s with the super slow-motion feature. The result was a functioning application that can be downloaded on both mobile phones as well as computers. The final application page consists of a header with five buttons, a canvas where the recorded video is displayed and a plot window at the bottom of the page to show the sequencing of the voltages. This application could reduce the workload on Ericsson employees, allowing more time for higher priority tasks than voltage measurement and contribute to an overall decreased environmental harm since far less instruments and components are necessary. There are only parts of the program added throughout this report, such as functions and other relevant lines of code to make the text easier to understand. The entire code can be viewed by Ericsson employees only. Abstrakt Syftet med detta projekt är att utveckla en applikation som kan verifiera uppstart och avstängnings sekvensering av DC/DC omvandlare och som kan laddas ned på mobiltelefoner så att anställda på Ericsson kan använda applikationen på sina företagstelefoner. Det fastställdes att en kombination av JavaScript tillsammans med HTML och CSS var det bästa sättet att skapa ett program som kan mäta pixelvärdena av LED-lampor på probe opto-moduler, som användaren placerat på ett kretskort, från en inspelad video. För att få så exakta värden som möjligt från de förinspelade videorna användes super slow-motion kamerafunktionen, med en bildfrekvens på 960 FPS, på en Samsung S22 telefon. På grund av lagrings begränsningar på telefonen kunde videon endast filmas i ungefär 0,5s med super slow-motion funktionen. Resultatet blev en applikation som kan laddas ned både på telefonen samt till dator. Slutversionen i detta arbete består av en huvuddel med fem knappar, en canvas där den inspelade videon kan visas samt ett grafritarfönster där sekvenseringen av spänningarna visas. Denna applikation kan lätta på arbetsbelastningen för Ericsson anställda, frigöra mer tid för annat viktigt arbete och minskar företagets negativa miljöpåverkan. Det är endast delar utav programmet som är tillgängliga i denna rapport, så som funktioner och andra relevanta stycken av kod för att göra det enklare att förstå texten. Hela programmet finns tillgängligt för Ericsson anställda endast. Abbreviations • PWA: Progressive Web App • OpenCV: Open-Source Computer Vision Library • RGB: Colour model – Red, Green, Blue • HTML: Hyper Text Markup Languages • CSS: Cascading Style Sheets • POM: Probe Opto-Module • LED: Light Emitting Diode • URL: Uniform Resource Locator • ROI: Region of Interest • FPS: Frames per Second Acknowledgements We would like to thank Camilla Karlsson and Fredrik Larsson for trusting us with this project and welcoming us when we first arrived at Ericsson. We also want to thank Sverker Sander and Björn Olsson who are the founders of this project and provided guidance to us as we continued to develop it. Our experience at Ericsson Electric Power Department has been nothing but great. Johan Nicander at Ericsson “Garaget” deserves a big thank you for his expertise. He dedicated a lot of his time to help us with server- and programming issues as well as being someone to discuss problems and ideas with. We also want to thank Bruna Dos Santos Arujo who was very helpful and guided us through many of our programming issues. Finally, we would like to thank Thomas Hammarström for agreeing to be the examiner of this project and helping us through the writing process. Arvid Karlsson & Awaz Nabi Pour, Gothenburg, June 2023 Table of contents 1. Introduction ........................................................................................................................................................... 1 1.1. Background .............................................................................................................................................. 1 1.2. Purpose ....................................................................................................................................................... 1 1.3. Delimitations ............................................................................................................................................ 1 2. Theory....................................................................................................................................................................... 3 2.1. Sequencing Verification ....................................................................................................................... 3 2.2. POM ............................................................................................................................................................ 4 2.3. PWA ............................................................................................................................................................ 4 2.4. Visual Studio Code ................................................................................................................................ 4 2.5. HTML ......................................................................................................................................................... 4 2.6. CSS ............................................................................................................................................................... 5 2.7. JavaScript .................................................................................................................................................. 5 2.8. OpenCV ...................................................................................................................................................... 5 2.9. Fabric .......................................................................................................................................................... 5 2.10. Plotly ............................................................................................................................................................ 5 2.11. Python ......................................................................................................................................................... 6 2.12. Pixel Value Measurement ................................................................................................................... 6 3. Method ..................................................................................................................................................................... 7 3.1. Initial work ............................................................................................................................................... 7 3.2. Graphical Design Planning ................................................................................................................. 7 3.3. Developing a functional webpage using HTML and CSS ...................................................... 8 3.4. Algorithm in JavaScript .................................................................................................................... 11 4. Results..................................................................................................................................................................... 14 5. Conclusion ............................................................................................................................................................. 16 5.1. Initial Work ............................................................................................................................................ 16 5.2. Graphic design planning ................................................................................................................... 16 5.3. Developing a functional webpage using HTML and CSS .................................................... 16 5.4. Algorithm in JavaScript .................................................................................................................... 17 5.5. Environmental impact ........................................................................................................................ 17 5.6. Future development and improvements ..................................................................................... 17 Appendix A .................................................................................................................................................................... 19 References ...................................................................................................................................................................... 20 1 1. Introduction In this chapter an introduction to the project is provided, which purpose is to develop a method to confirm the voltage sequencing of DC/DC converters at Ericsson electric power department. First, the background as to why the project started is discussed, followed by the purpose of the project and how to achieve it. Last, the delimitation of the project is presented, such as phone camera limitations and time constraints. 1.1. Background This project started in 2014 as an investigation into an alternative way of verifying start-up and shut- down sequencing of DC/DC converters. The reason as to why this project started was to investigate a new way to measure voltages on DC/DC converters. This could lead to more efficient work for the employees at the Ericsson electric power department as they can focus on other more important tasks. Ericsson produces their own power supply to most of their products which puts a lot of responsibility on the electric power department. There are strict specifications sent to the department from other users within the company, stating the time and amplitude of DC/DC converter start-up and shut-down sequencing. At any of their circuit boards there could be up to 50 different voltage levels to supply other components that needs to be sequenced in a specific order. If it was possible to use a mobile phone to confirm the sequencing of the whole board at once there would be considerable time saved. 1.2. Purpose The purpose of this project is to make voltage sequencing verification less of a time-consuming task for the employees of the electric power department at Ericsson. To make the process user friendly one of the main goals is to use a mobile phone to measure the voltage sequencing. Since voltage is not easy to measure with a mobile phone, small LEDs are fitted onto a circuit board where the testers would usually measure the voltages. By doing it this way it is possible to utilize the mobile phone camera to measure pixel values and confirm the timing of when voltage is applied across every measuring point. To achieve this, there are a few procedures that needs to be carried out [1]: - Study DC/DC converter sequencing requirements in Ericsson product design specifications. - Measure onboard DC/DC converter sequencing with available probe opto-modules. - Develop algorithms for measuring of light intensity. - Program an Android application that presents results alongside sequencing requirements. 1.3. Delimitations Since user compatibility is important, the devices used to film the circuit boards are limited to company provided mobile phones, mainly the latest Samsung or iPhone model. This means that camera quality is limited, both in its ability to capture pixels and in filming slow motion videos. User error will also factor when filming the LEDs, there is no specific setup in place to hold the mobile phone still for example. 2 Due to company rules and regulations an open server was not an option to use, it had to be closed to Ericsson employees only to comply with safety standards and prevent the risk of the server being infiltrated. The timeframe of the project is limited to approximately 2 study periods, or 16 weeks, with other courses running parallel at 50 %. 3 2. Theory This chapter provides necessary theoretical knowledge to understand the method that was used to achieve the resulting application, starting with Ericsson sequencing specification and the manufactured probe opto-modules. After that the software is explained, such as the programming languages, IDEs and libraries that are used to help simplify the code. Finally, the pixel value measurement is explained. Abbreviations used within the report are explained in the “abbreviations” chapter. 2.1. Sequencing Verification Ericsson products are subject to requirement specifications that they need to adapt to. Among these requirements are voltage sequencing of both shut down and startup of DC/DC converters, which can be seen in table 1. These timing requirements are critical and on any given circuit board there could be up to 50 different voltage levels each with their own timing. The sequencing requirements could say that one specific output of the board should be applied with a voltage level during the first 0-25 milliseconds of startup and another output should be applied no more than 15 milliseconds after the first one [2]. The specific sequencing times matter a lot since certain circuits need to be active before others to enable correct behaviour. Table 1: Voltage sequencing specification. [2], Adapted with permission. 4 2.2. POM POMs, or probe opto-modules, are used to indicate that a voltage is applied across outputs on the circuit boards. They are fitted with LEDs which lights up as voltage is applied. The POM circuit was designed by employees at the power department as a part of the initial project. They were manufactured at the Ericsson production line in Borås and were assembled by hand. Their size is very small which makes it possible to fit a lot of them onto one board, for example one of the POM dimensions are 5.5 times 5.5 millimetres. They were created in a range of different voltage levels to be compatible with most of the levels used in everyday business, with the lowest one being 0.9-1.8 V and the highest one being 2.5-63 V [3]. Figure 1: Probe opto-modules. [4], Adapted with permission. 2.3. PWA A PWA, progressive web app, is a web-based application that can be installed onto any device. Once the PWA is installed on a phone it will look like and work just like any other application and will among other things: have an icon on the home screen, open its own window on the device separate from the web browser as well as be functional offline. Many popular applications such as Microsoft office 365, Hulu, Instagram lite and YouTube music are examples of PWAs. PWAs are available to download by opening the link to the web app, but they are also available online to download from application platforms like Apple’s app store and google play store [5]. 2.4. Visual Studio Code Visual studio code is a broadly used code editor and is supported by many coding languages such as JavaScript, Python and C++. It supports development operations such as debugging, and task running and provides a broad range of necessary tools for developers. Visual studio Code has many different features such as, live sharing, debugging and built in source control [6]. 2.5. HTML HTML is the most used markup language to create and structure the content of a webpage. In HTML a page is built sectionally using tags such as and . Within these tags an array of different elements can be introduced to create a website or application such as file inputs, buttons, scrollbars, titles, and images. HTML code is written as a text file and web browsers can interpret the tags and elements which is displayed on the page [7]. 5 2.6. CSS CSS code is a stylesheet language which is used together with HTML as a way of formatting the looks and style of a webpage. It can be used to change font size and style, colours of different elements and alignment of elements within the page for example. CSS is helpful since it allows the creator to separate the content creation which is done in HTML from the appearances of the content. CSS code is written using selectors which can target different elements in the HTML code. The creator can for example target the body element of the HTML file and in the CSS code define the font style of everything in the body to be times new roman [8]. 2.7. JavaScript JavaScript is a programming language that can be used to incorporate more complex features and functions to webpages. This makes it possible for webpages to do things like react to a click of a button or take the user to another page which gives webpages more functionality and broaden the user experience. While HTML and CSS help creating the shell for a webpage, JavaScript is what makes the webpage function and react on user interaction. JavaScript can be written directly into HTML code by using tags. It can also be written in its own file that later can be called in the HTML file. Together, CSS, HTML and JavaScript can create a fully functioning webpage with many different types of complex features [9]. 2.8. OpenCV OpenCV is a library of algorithms and functions designed to make programming easier when working with visuals such as camera and video capture. It was initially created for C++ code but has since been converted into multiple programming languages, such as python and JavaScript. According to [10] the OpenCV library has more than 2500 optimized algorithms that ranges from computer vision to machine learning algorithms. 2.9. Fabric Fabric is a JavaScript based framework that makes it possible to create interactive geometrical shapes like circles, rectangles, and polygons [11]. By using Fabric, it is among many other things, possible to change the size, rotation, and position of the different shapes by clicking on the screen. Fabric also makes it possible to manipulate HTML canvases by creating an interactive object on top of a canvas element [12]. 2.10. Plotly Plotly is a JavaScript charting library with a large range of chart types including statistical graphs, financial charts, 3D charts and much more [13]. Plotly enables highly customizable graphs and plots which makes it easier for the developer to create user friendly content. Every chart within the library is interactive, meaning that the user can zoom in and out or mark data-points within the plot for example. 6 2.11. Python Python is a high-level programming language. It launched in 1991 as an option to other existing programming languages such as C, C++, or Java. The main goal was to make it easier from users to write complex code using fewer lines [14]. Python is a general-purpose language that can be used in many different cases and projects, from self-driving cars to machine learning and AI. Python is popular among developers due to its large community and range of easily accessible function libraries. There are many forums dedicated to Python programming which also makes it easy for beginners to ask for help and guidance [15]. 2.12. Pixel Value Measurement Within the scope of the project was the ability to measure light intensity to be able to verify a change in voltage applied across specific points of the circuit boards. However, there was found to be an easier way of doing the verification which was to measure pixel values. The way it is done here is to use the functionality of the OpenCV library. In the library the function “mean ()” [16] calculates the mean value of a pixel or multiple pixels within a 3-channel (RGB) image. This makes it easy to determine when a LED is turned on or off due to the difference in RGB value. The video is converted to grayscale to make the distinction even more clear. A LED which is turned on displays a bright grey light which approximately has a RGB value [200, 200, 200] while a turned off LED displays a dark grey light that has a RGB value around [50, 50, 50] [17]. This is shown in table 2. It is important to realize that these values are ideal, in reality the values will vary depending on lighting within the room that the video is being filmed, the angle of the mobile phone camera and the distance between the camera and the circuit board. Table 2: RGB values. [17]. Red Green Blue Colour 50 50 50 Dark Gray 120 120 120 Medium Gray 200 200 200 Light Gray 0 0 0 Black 255 255 255 White 7 3. Method In this chapter, the method of creating the finished program is explained in the chronological steps that it was performed. Starting with initial work which included research and testing different platforms. When initial research was finished and programming languages were decided the graphical design planning, how the application was going to be used, took place. Finally, the actual programming began in JavaScript, HTML and CSS. 3.1. Initial work The first objective was to investigate how the mobile phone application was going to be created. As the project started in Matlab and a functioning algorithm had already been created there, the initial work became more focused on converting the code from Matlab to a mobile application. It quickly became clear that this was not the most effective way to continue as Matlab’s compatibility with phone application was limited. After further research, Python code seemed to be able to create web-applications which then could be used on mobile phones, not as an app but rather as a website. Python was also extremely well compatible with OpenCV which seemed to be the best way to measure the LED pixel values. The connection was simply done by one line of code, followed by a reading of the video file through OpenCV. # Import the OpenCV library import cv2 # Read the video file using OpenCV cap = cv2.VideoCapture(root.filename) It was then possible to manipulate the video file with existing functions from OpenCV. The algorithm was created in Python and almost became a complete and fully functioning program. While the algorithm was being finished the connection between Python and the web proved to be more difficult than what was initially believed. More research was done and after collaboration with Ericsson developers it was determined to write the algorithm in JavaScript and use HTML and CSS as the visual presentation since this combination is by far the most widely used combination for web applications. To make it work on a phone it was decided to turn the program into a PWA [18] using an existing template [19]. This way it could be downloaded from a link without having to go through Appstore or google play store. OpenCV is not as compatible with JavaScript as it is with Python but a sufficient part of the OpenCV library have been converted to JavaScript. Videos to test the final application were filmed in one of the power departments labs using their existing circuit boards. There, the start-up and shut down of a power supply circuit board was filmed using the super slow-motion camera function on a Samsung S22 mobile phone. 3.2. Graphical Design Planning During early stages of the project a plan of the applications graphical presentation took form. Since the target audience were the employees working in the power department labs it was decided to create some sort of testing involving them as soon as the first working prototype were available. The 8 key features were clearly defined alongside the supervisors, as can be seen in the purpose part of this report. Initially the goal of the user experience was quite simple: - Film the circuit board with POMs attached. - Mark ROIs (Region of Interest). - Process the video and measure the LEDs. - Present the data on a new page in a graph. However, as the project moved forward changes were made from the initial graphical design plan. Some of the features proved to be very difficult to achieve, such as the fact that a user could not drag their finger on the canvas element to navigate the screen of the phone. The solution became to use the existing scroll-function of the mobile phone. Other changes were made due to better and more practical solutions presenting themselves during the project. It was decided that the graph presenting the results should be presented below the video instead of on a new page to make it easier for the user to remember which ROI was connected to which POM. As far as the aesthetics of the application go, colours, fonts, and style, could be improved upon to. 3.3. Developing a functional webpage using HTML and CSS HTML was used to create a functional webpage that has all the necessary blocks for the program. The HTML code created a shell for the web application and makes it possible for the user to interact with the program. Text, Buttons, canvases, and plots were all coded in HTML and then presented on the page. The first part of the HTML code declares what type of document it is and sets the standard language of the program to English. The next part of the code was written inside the tags. This part contains metadata and links to external libraries such as OpenCV, Fabric, and Plotly. The JavaScript file was also linked here. The top lines of the section of the HTML code specify the character set and browser compatibility. The title of the application was thereafter set to “Optoprobing app”. The next tag set the webpage to the same size as the device that was currently used. Optoprobing app 9 After the tag, there are two rows of code. The first one makes the webpage downloadable and is a crucial part of turning the webpage into a PWA. The second row sets the icon of the application. The next line of code links the CSS style document to the HTML document. To enable offline usage and faster loading of the page, a service worker was included in the code [20]. The main JavaScript file was linked in the HTML code to enable interaction with the HTML blocks and the main algorithm of the program. The next part of the HTML code is the . Everything that is seen on the page from the user side was coded in this block. At the top of the block, the title of the page was set to “Optoprobing”.

Optoprobing

Thereafter, an input button was created so that the user could upload a video. The “accept” line in the tag specifies what type of file is allowed to be uploaded.
A header with informative guidelines and five buttons were then created. The first button initiates the processing of the video through the JavaScript algorithm when the user is finished marking ROIs. The second button was created so that the user could delete the latest drawn ROI if it was placed poorly. The third button is used to reload the page and let the user start from the beginning. The fourth and fifth buttons are used to increase or decrease the size of the ROI. The next part inside the tag displays the video and canvas elements. Two canvases were created and placed on top of each other. The first one was used to display the uploaded video and the second one was used to draw ROIs on top on the video. Both canvases were set to the same size to make it seem to the user that there is only one.
10
The size of the canvas element was set to 720x1280 as this is the standard size of a video filmed with the Samsung s22. The last part of the HTML file plots the result of the pixel measurements. The X- axis of the plot represents time in milliseconds, and the Y-axis represents the mean pixel value. In many of the parts within the tags there is an “class” attribute. This is what is used to tell the CSS document how a specific part of the program should look or behave. The class attribute that is called “top” is used in the CSS document to set the text fixed at the centre of the page, the font size, font style and font colour. The next class attribute, mid, also fixes the file input button to the centre of the page. In the “buttons” class attribute all the button sizes, font sizes, font styles and colours were set. An animation was also added to the buttons so that they react when being clicked on. This was done to make it clear to the user a button has been clicked. buttons { margin-left: 10px; /* leftside margin */ height: 70px; /* button height */ width: 150px; /* button width */ font-size: 16px; /* button font size */ margin-right: 10px; /* right side margin */ border-radius: 8px; /* button border thickness */ text-align: center; /* center button text */ } The