Yi Sheng is a self-taught developer with a passion to create, teach and share. He worked in finance and wealth management before doing work in web development, web scraping, data analysis and more. He is currently a core developer on the open-source RPA tool TagUI.View the profile
About the talk
AI Makerspace is a platform offered by AI Singapore (AISG) to help SMEs and Startups Accelerate the adoption of AI in Singapore. It provides a suite of AI tools, APIs and pre-built solutions (Makerspace Bricks). The Makerspace Bricks are developed by AISG engineers and put up as free downloadable tools, libraries and assets for open source software or APIs. TagUI is one such Makerspace Brick for robotic process automation(RPA). In this workshop, Yi Sheng will guide participants through the basic usage of TagUI.
- Using TagUI in common web scraping tasks
- Using TagUI in common desktop interactions
00:18 Automated workflow
03:26 Using the Chrome
08:05 Daily declaration
13:36 Getting the value
18:28 Installing the dependencies
23:18 Identifying the elements
28:28 The method of clicking on the elements
32:31 Interacting with the web
36:00 Using the framework
Everyone, my name is Asian and I'm in RP Ingenuity. I Singapore contact UI. But you why ultimates processes for you and each automated workflow is called a flow. These flows I just text files with instructions easy to write open understand and to use now. Let's look at a few flows to watch tokiwa in action. Chansey gen 3 flows on my desktop saved and deployed as a double-take herbal flows. It's really really easy to do this. I will look at how to do it later. If that's what you want to do.
The first one update temperature is related to our current covid-19 situation and US require us to lock our temperature twice-daily in two separate photos. One of these is behind a log in wall. So it can be a bit cumbersome to do this multiple times a day. And is it to separate links? So we wrote a simple flow to update both sides inputting of temperature and just once Best hookah, how it works. Double-clicking the flow Ronstadt UI which opens Chrome automatically
36.4 epicenter in u.s. Pizza Westfield in when the flow coasted login page check whether I'm already logged in if I'm already logged in evil. Skip to login steps. What is clever enough to do that? Now it go open another session of Chrome. So that I can go to Google Sheets. And from here, I will go and search for my correct row and update the correct column. Thanks with a simple flow intake UI. Let's look at the next flow. Forex gmail.com and I will cook this please quit. I'm
going to go to a page on DBS website. To get a lot to get a list of exchange rate. Call Daddy. This is very common situational of manufacturing companies that are cut down the street for the day to use in their daily costing so go to that page copy down all of the exchange rates. Again, it opens Chrome. Do all floors need to use Chrome and you can specify in order to open Chrome as well as reading and writing it into a CSV. It counts the number of rows in the table through each row.
write 2 as a row in a CSV Chrome again Gmail and it's going to send an email list on the steps that we're programmed. and that's not and look at the result of the flow. best numbers of CSV yellow exchange rates all saved automatically at a certain time is really easy in this later. The last Loggia is letter flow. What is going to do is open a Microsoft Word document and document template with a few you can save fields that need to be filled in based on certain information.
So it will update those View and print out a document. electrical connection this is going to be quite interesting because it doesn't it doesn't use Chrome for once and it also uses OCR on the page. So he is going to look for address of donor. Using OCR then is going to use is going to move the mouse to double click it and replace it with the correct. Text OCR to find Daytona name. And then it's doing it for me. Cuz I'm just trying to get to 1 Nokia. I messed up. That's what you have
for that you why samples? Who was just witnessed how powerful take you I can be and these are just a few simple floors to demonstrate the capabilities of time you I don't fall behind these flows, NC housing police. The first one update temp. Tag any kind of text editor. I'm just going to be using vs code Visual Studio code because my normally use anyway. Pisgah is the entire flow. It's pretty Compact and you can see that a lot of the same text is really simple. Trusting we can look at
each row in this flow and in general in tell you I close a divided into steps. Each line is generally a step is the first word that we have a space and this is what we want to ask this, We just going to prompt the user for text input 36.4 And then now when I stayed pumps for texting but that input will be saved as ask underscore result. The second line is just to say where can I create a new variable which is called Muse at 10 and we can assign the value of us
just to make it just use the temperature. Now we're just going to visit the URL and US portal so that we can do all daily declaration. The step boss just testing the entire URL enough to detect if this is a URL and I should visit it. How would you write a statement if exist username? Chase pay by checking there is an element that looks like username in the account Backpage. If there is that means we are at the login page need to look it if we don't see this page means we're already logged in from a previous session.
JoJo C. Type username as what username is the name of the element in the web page and type it pass. And this username here is safe locally on my computer. It's a variable that saved locally and this is useful because this is this allows us to share this floor break easily address without having to share our username and password, of course. You want to look cool. ESV? competed with your local variables judging me type the temperature. This is the name of the field element input element on the web page and you can see how simple it is. Really?
It's caused all this these two steps within the block after is closed. So they will only happen if we are blocked by the login page. We have the keyboard step. If you do stop Nexus interact directly with the keyboard Windows key and pressing R2 windows are from the center the easy way to open applications in Windows on Mac and Linux its cost at 4. We can see that this automation is simply keyboard interactions using shortcuts. We feeling the URL address of
control El allowing us to enter the URL web page. And then we have till we get to the web page you Ctrl F to look for name. and then Chris write a number of times so that we can enter temperature in the correct column. That's it. Let's look at the next flow. It's going to be. Forex Gmail You're just a little bit longer, but no more complicated. Again from the start. We're going to visit the URL of the DVS exchange rate. Speech. Dumps that allows us to create a new file
and it's good to write this into the file is going to write currency, rate into a file called them. CSV. Distance creates the column headers for CSV file as CSV file is a, separated values for the, hear the First Column second column. Next Red Wing to count the number of rows in this page. If this page and this is the mofros in the foreign exchange rate table inside discount function we have and some of you probably become love this already. This is a very common and expressive powerful way to identify elements on a web page.
So we have an expression which is the number of rows to give CPR if any of your family with HTML. The Artisan table rules and Rec accounting the table rules signed at 2 to the variable rules and we going to look through this number of times based on the account. And then each time. We're going to call it the variable row. Now we have to read step. This basically looks at the webpage wreaths and elements text or attribute to other social. We're going to look for this XPath. Am I going to get the value and store it into
the variable called currency II value like we two-story into the variable car rate. Fentanyl simply going to assign this this this values and put them into an array into a list and call it for ex raid next. We're going to Simply write this whole Forex rate as a CSV roll. Exuded members. CSE that we created Alia Alia right just this text as a new row in a previous file, then we just go into to open up another instance of Chrome. Why would open it another instance of chrome here is because a Google blocks some alterations
when you are using me the browser so far is about Gmail. Sometimes you won't be able to change my Gmail. And so now we open Gmail in a separate browser then click on composed of what was composed of PNG image recognition on the current screen. So this is visual automation. It's going to look for anything that looks very high percentage similar to this and it's going to go. Cricket to compose a new email we click it. We wait for a second. We tight an email
the email subject with quick attach and detach. I'll follow I'll follow and we can send it using keyboard shortcut. pretty simple Let's go to the last flow. That's going to be let the flow. She'll go to use OCR has mentioned of you open. The document is the path to the temple document. We're going to put it on to the clipboard and we paste it, and as we see Co next we have the week, and we went for a few seconds. Then we have your address of Dona using OCR.
How old is what is? Thank you. I will look at the current screen. It will scan your entire screen for text turn this entire screen image to text the address of Donna and it goes to the location and double sexy. Then after that, we'll just replace it with 123 automation Lee. It does the same amount that you can see how powerful the OCR feature of Quicken and finding locations on your screen. Just based on a text can be helped. Hope we can be next we look at how to install tenderizer to self
so you can get started with that you I just a documentation for why it's on and you just simply go to installation on the left hand side. And it gives you installation instructions for Windows or Mac or Linux. Since I won't Windows, you can just click you get you the direct link to the zip file. Next we don't answer this file to C drive directly onto C drive. Give to install dependencies. They're too dependent for Windows. First one is openjdk for you is raising a flavor of openjdk Amazon. Corretto. It's completely
free. Mixing meth in solid Chrome most probably already have this installed so that should be fine. Once you're done with that, we just need to open a command prompt. simplify rewind instructions on how to do this and then became a at ey source to a the abyss and then we can run office blow. So this is our first blow and we can run it. If it's that sparkly without never let me see it in the store that you are properly. Sofia the First simple flow goes to latest movies
today and a snips a screenshot of the image of the results just a really really simple flow. If you have any problems with that, you can go to having problems and then check whether these problems are applicable to yourself. If not, you can also come to our page and then post an issue and out you have issues pitch. That's it for insulation. Really really simple. The Amazon carretto is a installer you can just click through and DIY windows pictures of zip file I am Jack's track this directly onto C drive directly onto C drive to be just like that.
Know that we have set up Tech you why do you see no easier to do that and now we're going to write our first floor. Go to file explorer navigate to see Dr. UI flows folder. This is where we recommend you write all of your clothes. You can separate them into different folders. So, let me have a life first floor. And then I'm going to create a new phone. I'm going to have a text document. I'm going to call it slow. T a g Auto offload files that text files
are required. TGIF session at the end. I'm just going to open this with Visual Studio code. Yes, although you can use whatever text editor you like even. Pad. Do you know if opened off so we need to think about what we want to do with this? So how about for a Simple Start? We can go to a web page and click around my page. Look at how we can do that. So why not? We just come to the documentation page and this is all documentation URL. I copy it and I'm going to taste it you so that means that
you I will come to this page and then and from here we want a kyi to click on Main Concepts just like that as a simple first flow mean Concepts As I mentioned earlier on you I can read. Elements elements on a web page using the dog using XPath but it also has more intuitive simple systems to try to identify the elements. Sofia if you just do click main Concepts it should work. They'll talk about why Lisa. And they will do week 5 so that we can see to make sure that it works and now let's run this flow. Play we
do click main Concepts that you I will look for the entire look through the entire job and look for any elements where he has a meme that looks like me and Concepts or a class that looks like being Concepts or ideas for sure. Let's run it. So, how'd we run? This flow? Let's go to a command prompt. Ocmd I believe we have we haven't seen Drive taking you why smashed flow my stuff and I'll just do that. Anyway, first flow. stoptech And only opens Chrome. As we expected
it goes to the web page and it will click on Main Concepts. So tell you I was able to look for income tax. I didn't fight and 2nd across this floor is not very useful, but it's just a simple special that we can do that demonstrates is clicking and using the web browser. How do we deploy this Flores the Chicago? Just do it Tech you I trust flow. - D. This is an option. We can deploy. Can you reset the first floor. CMD? I stopped and now we can double-check this to write a flow. simplest and
and can see that it works. All right. It's going to finish in a few seconds. This is probably a good time for us to look through the documentation of text you I Pennywise version 6 just released and with it. We have a brand-new documentation of read the dogs on top of the installation instruction. You also go to the main concepts of that you I'd advanced concepts and a reference of all the steps run options and all the help of functions that we can use some of these I look like so we go show the flows. We also have the chiefs
showing demonstrations of each feature show you how to use it. enes Kanter if you move your floor to another folder and you need to create a new without tags how to we just do that option again Joseph flows from online from a URL on line like just here you can run the floor from Be Fitness, using a browser invisible browser. Okay, we got the steps and it goes to how to use all the steps at the most common steps like click visit type. Beauty went through some of the features time steps.
documentation theme class title or even getting started in this text Well, so you can also provide the. Which is expressive way and a very elements coordinates of the screen clicking on elements because something element can move around beasts on Xbox S longer or shorter websites just changing the possibility to click on points based on coordinates. We can also quick based on images like what we saw in the demonstration Aaliyah. We have visit my page type. This is very common. You want to type
something into a into weapon put so it is the name of the input and we will type some text into it. How are you? Continue on we can see the different types of identifiers. So this stop this dumb chick on points have region identifier identify just a way for us to identify what we want the steps to work on so we can do Reid and this is a region 300 400 to 500 550. That means between points 300 400 s x Y coordinates on the screen to another point, which is
550 the rectangle bounded by two points to a variable. Play some very useful to look to read documents. We have scanned documents if you want to match his wife says report make sure they match up. City also use this OCR reading. Which is an excellent way to test out and develop your own flaws is an interpreter for 10 UI to you can just type in steps and then it will execute you stepped line by line and that's what works and what doesn't work. If statements blah blah blah.
This is the data table. And then it will run it with this a variable values of the variable a username for pee test account password will be blah blah blah and so on so forth with him clothes and a lot more if you want to learn more about it and figure out what you can do and how to do a certain thing inside you I want to go to the reference. This is where you can list of all we can see all the steps to interrupt the mouse and keyboard. These are the things you can do. In fact the web decent things you can do so on and so forth. You
by a printing it to the standard STD out standing up. And then it will be printed to send it out in Python. It will be saved as py result back in the tech you I run time. That's his kid. Why not be trying to look at a more involved flow contact slow and right it will tell you I know that we have documentation I with us. Turn on the documentation to create a second Mall Complex flow. We have a Facebook, It's a website that has deals for group purchases so that they can be quite attractive
some of this. So let's get a fluid that comes to this website looks for you to try one for one and then save them for me into a list. So, how did you do that first and you flow? Will create out folder second floor and we create a new flow. Which I will call second. I am picking up going to open this in any text editor. I'm just using yesco heal and cure. Best thing to do is to URL to visit copy this URL and I will get together. Next I want to do is to write a list of the fuse. So the easiest way to do this is to create a CSV file
and if you saw from the earlier flow-rite a few foreign exchange demonstration, so you can just copy it and use the same to dump you. and the link that sounds about right to refuse of Jessie. We're going to count the elements which have the deals. So we each of these cuts on Katja. We're going to count all these going to right click and inspect. So it looks like this elements in the day of class column and you want to cut cement so I'm going to use X have to look through to identify this element and count them. So.
He should be this elements of weather looking for all these elements which have the class equals to this. And that should be good and going to call Dee's Cuts. Please cut. Call cut from 1 to carts. So now we're going to look at this process to look through all of these cuts and for each card. We're going to see you want to read? this cut don't be coming from go from 1 2 3 4 5 6 7 after all of these elements did the second one, but that won the 450. He's back text will replace is cut with either one, two, three, four, five, whatever
and member the lupus in. Okay read from this every week to cut but we don't go into that. We want to get this right which is the name of this. This this offer so which is under any class content. So what can I do? cross equal to content / 3 and this will be. But I don't just want to grab it to you. I want to grab with you only if Paducah Pizza 141 so I'll do it if statement if you contains 141 So when someone always looks like this all do 1-4-1 soda contains one then I will. Say
I want to get the link as well. So I'm going to read something to link. rest Yeah, I'm going to get this link we should last me to go to the actual deal after I've left it out all day just induced. So this is the actual link completely Casa Pasha Ling, which is / a Singapore. So we need to add on this my face., the front so I'll do a copy of a copy from here. And I'll make a note that I need to add on this my favorite cam. So for sure now we're going to do this this time.
euro equals to Do you? And then we'll get it on my feed. Com in front of the link. And now we have our Bureau and we can write this Bureau. to our use of tsp female Oscar Tolkien what What's Happening Here is we go to this webpage. We create this deal. ESV with the column headings. Do you and Link then we count the number of cuts using XPath on w3schools. XPath w3schools this really good link to Lenox Ave. And then from here. Where can I check a sign this
value to the deal and if the gene contains 141 we will write the row using the TU and the link. I'm going to write the road if you want to link. All right. So let's do this now. Let's run, you flow. Whether this works. Open Forex rate clearly because me shouldn't have a for x-ray. It was from earlier on Euro. So we will try again. These damn you can look at the chemical. It seems to be looping through elements. And okay looks like it's finished and 16 seconds. Okay, escrita lcsb phone and can check in
a little bit. So we handle deals excellent and we have all these things. And I am look for that use about dreams with my girlfriend. Okay, so that's it. Again, we can deploy these this flow easily. Yes using the T option now we have this. I wish I could bring it to our desktop and we can also run this using Windows scheduler. schedule a task scheduler With task scheduler we can tell task scheduler to run this every day at a certain time is pretty simple to the basics. You treat a basic task.
4 q delius Everyone days. Yes start a program. Yes, and then I'll just see please open second. And then that's it. No is going to start at 4:32 p.m. Everyday before I go home for the day and check for any nice 141 do so. I can enjoy on that day. And that's it with lent how to use Tech UI to write flows to deploy floors with seeing how easy it is to read the floors and to learn from the documentation. If you're interested in helping out tell you I will always welcoming contributors and you can choose and make pull request.
Buy this talk
Access to all the recordings of the event
Buy this video
With ConferenceCast.tv, you get access to our library of the world's best conference talks.