Shadowing Practice: The Simplest UI/UX Workflow With AI - Learn English Speaking with Video

Kies een oefenmodus

Elke modus opent een volledig scherm oefenruimte.

130 zinnen
Als zinnen te kort of te lang zijn, klik op Bewerken om ze aan te passen.
1
Today we're going to build a complete mobile app from scratch using AI.
2
I'm going to show you the simplest UI UX workflow with prompts that you can copy.
3
The result will be a high quality and user -friendly app.
4
This workflow is based on my years of UI UX experience.
5
It breaks the process into five simple steps, starting with requirements, UI direction, then UX planning, and then we get into the build,
6
and finally testing on a mobile phone.
7
I'm just going to start with a very simple idea of an app called SideQuest for personal goals.
8
I'll start a new
9
Cloud project in Cloud Code in the desktop app.
10
I'll give it a folder to work in.
11
And now I'm going to start with the requirements.
12
I'm going to go to the first section here, and I'll copy this prompt.
13
I'll give it to Cloud, and I will replace this text with my app idea.
14
Here we go i set a mobile app
15
that helps people make progress on hobbies and personal goals through small weekly challenges
16
and then leave everything else as it is
17
this will get clout to ask me a few questions
18
and once i answer everything it will create a product brief document all right i answered all the questions here
19
it gave me a few rounds of questions and finally it created the product brief
20
And now I can find this product brief inside my folder here.
21
And now that
22
Cloud knows what we're trying to achieve, we're going to go and copy the second prompt.
23
This prompt will ask AI to create three different ideas for the UI.
24
That way I can switch between them and I can visually decide on which direction I want to go with.
25
And this will only be for the homepage.
26
I'm going to copy the prompt.
27
I'll paste it here.
28
here.
29
Let's see what we got.
30
Alright, here we go.
31
It gave me three different directions.
32
And it laid out everything for me here on the canvas.
33
I'm going to open up this preview mockup.
34
And here it is interactive.
35
It shows me each design on the right side.
36
And it explains what each design does on the left side.
37
There's also different states here.
38
So the first one here is kind of a paper style and sketching and highlighting.
39
It's really cool.
40
The second one is more gamified with a trail the more you complete the steps.
41
You can switch between the habits here.
42
And then the third one is more simple with cards that you can switch between.
43
I really like these.
44
Now here it's suggesting that I go with A or C because B is harder to implement.
45
So I don't care.
46
I'm just going to pick B because I want this app to be a little bit visual and gamified.
47
And I like this little trail here.
48
And if you don't like any of these options, you can always ask it to come up with more variations
49
and options until you find what you like
50
or you can even ask for a specific style that you like
51
and now when i say i want option b it's gonna automatically create the design direction document
52
and there we go it created the document i can find it here
53
and this document includes all of the details of the app all of the visual details
54
and the styling
55
but now we only have the home page we need to figure out the rest of the pages
56
and the user journey let's plan the user experience with this third prompt I'm gonna copy this
57
and this will tell the AI to figure out the user journey
58
and the user experience and they will create a UX plan document I'll paste this prompt here
59
and let's see what we got
60
and there we go it created a UX plan document it includes the flow
61
and the user journey here it also includes all the screens
62
that we need for this app and some more details
63
and now i can find the ux plan here in my folder it includes everything
64
that it needs to build this app now we still haven't built the app yet
65
so feel free to make any changes to the ui before you start the build
66
that way you have more freedom like for example right now I like the direction
67
but I want it to be more visual
68
so I'm gonna tweak the UI direction a little bit before we move into prompt number four to build that.
69
Now all the documents are ready but I want to make some changes.
70
I gave it a new prompt here just to modify the styling and the direction of the UI.
71
Now we have two new screens here on the canvas and it updated all the documents accordingly.
72
We can check out this new design here and now it looks much better.
73
more mobile -friendly, more interactive.
74
And here it changes based on the habit that we're trying to track.
75
Since the app is called SideQuest, this falls in line with the design direction that I had in mind.
76
It's like tracking your habits with an adventure -style UI.
77
Okay, this is great.
78
I'm going to say looks good.
79
All right, now everything is ready for us to start building the app.
80
Let's jump into the fourth prompt here.
81
I'll copy this.
82
This prompt will tell the AI to create all the screens
83
and create an MVP that is fully functional based on everything that we decided on so far.
84
I'll paste it here.
85
All right, here we go.
86
We have an actual working app right now, and this is the welcome screen.
87
It's asking me to add one of the habits or quests so we can pick here.
88
And each one will have the details about the quest.
89
And then you can add your own, which is really cool.
90
All right, so let's say I want to add sketching.
91
Okay, now I have it here.
92
And this becomes my home screen.
93
And then I can go to the map and see the next steps here.
94
When I complete one, it will ask me to add a photo.
95
Okay, I can test it here in Claude.
96
But since this is a mobile app, it would be very important to test it on an actual mobile.
97
And that's where the fifth prompt comes in.
98
I'm going to go back to my prompts here.
99
And the fifth prompt is for testing on a mobile phone.
100
This will ask the AI to host it on my local network.
101
And it will give me a QR code to scan on my phone.
102
And then I will be able to test it on my phone.
103
I'll just paste this here.
104
And let's see what we get.
105
All right, here we go.
106
We have our QR code.
107
And by the way, this prompt also tells it to give me a UX checklist.
108
That way I make sure that I'm testing everything on the mobile phone.
109
Here's my checklist, things that I need to test on my phone.
110
And let's scan the QR code.
111
There we go.
112
Now I have it on my phone.
113
It works exactly like a mobile app.
114
And now I can test the whole thing.
115
I'll go through it following the steps and following the testing plan.
116
And to make it seem like a full mobile app experience, I can click on share.
117
And here I can say add to home screen.
118
And I will add this app to my home screen.
119
There we go.
120
Now I have it as an app on my home screen.
121
I can just open it and I'll see that I have a full screen experience here.
122
I'll go through the testing.
123
And it feels like a mobile app.
124
And that's it.
125
I just went from a simple idea to a fully functional mobile app in just five prompts
126
while making sure the usability and the user journey are taken into consideration.
127
This workflow will get you to follow the correct process without having to understand the technical details of UX, UI, and coding.
128
The link to these prompts is down in the description.
129
Let me know if you try it out, and if you have any observations or comments, I answer everything down in the comments.
130
See you next time.

App downloaden

Alles wat je nodig hebt om vloeiend te spreken

AI UitspraakScoor elke zin
IPA OefeningBeheers elk geluid
WoordenschatBouw je woordenschat op
WoordenspelLeren terwijl je speelt

Zelfde Kanaal

FOR YOU

Aanbevolen Video

Woordenschat en spreektips bij deze les

Deze spreekles is gebaseerd op de video “The Simplest UI/UX Workflow With AI”. Deze woorden komen het vaakst terug: app, prompt, mobile, screen, document. Deze video bevat 130 zinnen en 1411 woorden om na te spreken. Het gesproken deel duurt 8:10. De spreker praat in een natuurlijk tempo van ongeveer 173 woorden per minuut, dicht bij een alledaags gesprek. 85% van de woorden hoort bij de 3.000 meest gebruikte Engelse woorden; de rest kun je beter vooraf bekijken.

Belangrijke woorden in deze video

15 woorden uit de video die het leren waard zijn, met uitspraak en betekenis:

WoordUitspraakBetekenis
prompt werkwoord/pɹɑmpt/aansporen, aanmoedigen
habit zelfstandig naamwoord/ˈhæb.ɪt/gewoonte
pasta zelfstandig naamwoord/ˈpɑ.stə/deegwaren, pasta
folder zelfstandig naamwoord/ˈfoʊldɚ/hechtmap, map
trail zelfstandig naamwoord/tɹeɪl/spoor
quest zelfstandig naamwoord/kwɛst/queeste, zoektocht
requirement zelfstandig naamwoord/ɹɪˈkwaɪɹmənt/vereiste, plicht
functional bijvoeglijk naamwoord/ˈfʌŋkt͡ʃənəl/functionerend, operationeel
scan werkwoord/skæn/afspeuren
sketch zelfstandig naamwoord/ˈskɛt͡ʃ/schets
canvas zelfstandig naamwoord/ˈkæn.vəs/canvas
adventure zelfstandig naamwoord/ədˈvɛn.t͡ʃə/avontuur
consideration zelfstandig naamwoord/kənˌsɪd.əˈɹeɪ.ʃən/overleg, beraad
highlight werkwoord/ˈhaɪˌlaɪt/naar voren halen, benadrukken
implement werkwoord/ˈɪmpləmənt/implementeren, (in de praktijk) toepassen

Phrasal verbs die je zult horen

WoordBetekenis
figure out werkwoorduitvogelen, er achter komen
check out werkwoordonderzoeken
come up with werkwoordbedenken, verzinnen

Zinnen om te herhalen

Korte, volledige zinnen uit de video die je in alledaagse gesprekken kunt gebruiken:

  • I'll give it a folder to work in.
  • I'm going to copy the prompt.
  • Let's see what we got.
  • I'm going to open up this preview mockup.
  • I'm going to say looks good.

Uitspraak om op te letten

De spreker gebruikt 34 samentrekkingen en verkorte vormen, zoals I'll, I'm, we're. Spreek ze kort uit, zoals je ze hoort.

  • De klanken “sh” en “zh”: consideration /kənˌsɪd.əˈɹeɪ.ʃən/, observation /ˌɑbzɚˈveɪʃn̩/, variation /ˌvɛəɹiˈeɪʃn̩/
  • Lange woorden — let op de klemtoon: interactive /ˌɪn.tɚˈæk.tɪv/, consideration /kənˌsɪd.əˈɹeɪ.ʃən/, accordingly /əˈkɔɹ.dɪŋ.li/, visually /ˈvɪzju.əli/, usability /ˌjuːzəˈbɪlɪti/

Klanken die Nederlandstaligen lastig vinden:

  • /æ/ — opener dan de Nederlandse “e”: habit /ˈhæb.ɪt/, scan /skæn/, interactive /ˌɪn.tɚˈæk.tɪv/, canvas /ˈkæn.vəs/, scratch /skɹæt͡ʃ/
  • /w/ — met ronde lippen: quest /kwɛst/, requirement /ɹɪˈkwaɪɹmənt/, workflow /ˈwɝkfloʊ/, tweak /twiːk/

Zo oefen je met deze video

  1. Luister de hele video één keer zonder te spreken en noteer de woorden die je niet kent.
  2. Begin op 0,75× snelheid, spreek zin voor zin na en ga terug naar normale snelheid zodra het makkelijk gaat.
  3. Neem jezelf op en vergelijk met het origineel; let daarbij op woorden als prompt, habit, pasta.

Wat is de Shadowing-techniek?

Shadowing is een wetenschappelijk onderbouwde taalleermethode die oorspronkelijk is ontwikkeld voor professionele tolkentraining en gepopulariseerd door polyglot Dr. Alexander Arguelles. De methode is eenvoudig maar krachtig: je luistert naar native Engelse audio en herhaalt het onmiddellijk hardop — als een schaduw die de spreker volgt met slechts 1–2 seconden vertraging. In tegenstelling tot passief luisteren of grammaticadrills, dwingt shadowing je hersenen en mondspieren om echte spraakpatronen tegelijkertijd te verwerken en te reproduceren. Onderzoek toont aan dat het de uitspraaknauwkeurigheid, intonatie, ritme, verbonden spraak, luisterbegrip en spreekvaardigheid aanzienlijk verbetert — waardoor het een van de meest effectieve methoden is voor IELTS Speaking-voorbereiding en echte Engelse communicatie.

Shadowing-techniek: lees de volledige stap-voor-stap-gids →