Behind the scenes of developing smart city mobile app for Expo City Dubai | IT's time to talk #5

00:00 → 00:01

Hello, everybody.

00:01 → 00:04

We are super glad to discuss today smart city

00:04 → 00:08

topics circling around one of the greatest releases

00:08 → 00:11

coming from the Merixstudio team.

00:11 → 00:14

Not a long time ago, our team,

00:14 → 00:17

in cooperation with Expo City Dubai organization,

00:17 → 00:20

released an application that supports people visiting

00:20 → 00:25

Dubai to get orientation and to make a

00:25 → 00:29

good use of amenities provided by the Expo City Dubai infrastructure.

00:29 → 00:32

The application from the very beginning stands in line with

00:32 → 00:37

the smart city concept, which is being introduced widely

00:37 → 00:40

among municipalities all around the world.

00:40 → 00:43

Today with me, I have special guests that are

00:43 → 00:45

standing behind this project.

00:45 → 00:47

I need to admit that there are much,

00:47 → 00:50

much more people standing behind this project,

00:50 → 00:53

but there are three brave volunteers

00:53 → 00:57

who agreed to share to share their story and

00:57 → 00:59

tell a little bit about the project.

01:03 → 01:06

Guys, if you could introduce yourself in few words,

01:06 → 01:07

I would highly appreciate.

01:07 → 01:08

Hello.

01:08 → 01:11

I'm Paweł, and I'm senior mobile developer at Merixstudio,

01:11 → 01:14

I started my career as an Android developer and worked

01:14 → 01:17

only on Android apps for about six years.

01:17 → 01:19

And now I also work with Flutter,

01:19 → 01:22

and I've been doing that for almost five years.

01:22 → 01:25

And I am responsible for the mobile app development index

01:25 → 01:27

puts in Dubai project.

01:27 → 01:30

And my main job is to ensure we follow good practices

01:30 → 01:34

and high standards in the app development while also making

01:34 → 01:39

sure we do not overcomplicate the features at the very beginning.

01:39 → 01:42

And I am not enthusiast of any platform,

01:42 → 01:44

so I appreciate both.

01:44 → 01:46

And wherever it's an Android or iOS,

01:46 → 01:49

I enjoy working with both and believe, you know,

01:49 → 01:51

each has its own strengths.

01:51 → 01:54

So for me, it's all about building great apps no matter the platform.

01:54 → 01:56

Thank you very much. Piotr?

01:56 → 01:58

Hello. I am Piotr.

01:58 → 02:01

I'm a backend engineer and tech lead here at Merixstudio.

02:01 → 02:06

I'm mainly responsible in this app for the communication

02:06 → 02:09

between the client side services that we had to

02:09 → 02:12

integrate and also our mobile app.

02:12 → 02:17

The challenge was also to cater to possibilities

02:17 → 02:21

of multiple, like, several thousands of users

02:21 → 02:24

using the app at the same time.

02:24 → 02:28

So any sort of scaling and stuff like that,

02:28 → 02:32

that's what I'm mostly responsible for.

02:32 → 02:36

Hello. I'm Karolina. I'm quality assurance engineer.

02:36 → 02:39

In the project, I was responsible for manual tests,

02:39 → 02:43

automated tests, and also managing data,

02:43 → 02:46

preparing data structure in client CMS.

02:46 → 02:48

Thank you very much then.

02:48 → 02:49

So as we can see,

02:49 → 02:52

we are talking today with an interdisciplinary team,

02:52 → 02:56

which was was carrying out the project from many different angles.

02:57 → 03:00

If you could tell me a few words about the beginnings of

03:00 → 03:04

the project, what was done before the first line of code

03:04 → 03:06

was actually written?

03:06 → 03:07

So I guess as usual,

03:07 → 03:12

we started with our extended workshops.

03:12 → 03:13

It lasted several days.

03:13 → 03:16

I guess it was, like, around two or three days.

03:17 → 03:18

During that time,

03:18 → 03:22

we went through all the requirements that the client has.

03:22 → 03:28

Also, many of the ideas that we had to park for now for the future because

03:29 → 03:32

The idea started as a smart city app,

03:32 → 03:36

but we had to basically slice just a bit of the

03:36 → 03:40

scope first and create an app for the visitors

03:40 → 03:45

that they can just move around Expo City to buy and

03:45 → 03:47

search for any amenities that they need.

03:47 → 03:50

I I can tell a few words because I was also involved in

03:50 → 03:53

that process that I remember that we performed, like,

03:53 → 03:57

a three day remote session with the stakeholders coming from the client.

03:57 → 03:59

There were product people there.

03:59 → 04:02

There were marketing people, multiple stakeholders having,

04:02 → 04:07

let's say, specific interest when it comes to this project.

04:07 → 04:11

So there has been a lot of prioritization going on in the beginning.

04:12 → 04:14

But we managed to carry it out,

04:14 → 04:17

create backlog firstly for three months,

04:17 → 04:20

later for six months, and now we continue development

04:20 → 04:24

partially on a maintenance mode.

04:24 → 04:26

Okay then. Another question coming from me.

04:26 → 04:28

The project is quite complex.

04:28 → 04:31

How did the prioritization look like?

04:32 → 04:35

How were the stakeholders involved in the project later

04:35 → 04:37

after the workshops?

04:38 → 04:43

I believe our clients know their goals pretty well.

04:43 → 04:47

We have our internal planning session, Merix team,

04:47 → 04:51

but then we have planning sessions with our clients.

04:51 → 04:54

And I believe cooperation is quite smooth.

04:54 → 04:58

A client know in advance that they have some big

04:58 → 05:03

events upcoming or new attraction will be built on the site.

05:03 → 05:06

So we're getting in advance new feature requests,

05:06 → 05:10

or what kind of enhancements has to be done in our exit

05:10 → 05:15

existing features as client know what they what they

05:15 → 05:19

need in in the app in the future and in which

05:19 → 05:20

direction app should go.

05:20 → 05:25

So I believe the task prioritization goes pretty good in this project.

05:25 → 05:29

Alright. And how many people have been working on it?

05:29 → 05:31

Oh, quite a lot.

05:31 → 05:37

Like, the the the project is right now we we started one year ago.

05:37 → 05:42

So there were were a lot of people involved during this year.

05:42 → 05:45

Like, the core team is five people right now.

05:45 → 05:46

Right.

05:46 → 05:50

Like, here we are back end developer, mobile developer,

05:50 → 05:50

quality assurance.

05:50 → 05:52

We have product management.

05:52 → 05:56

We have one people one person from

05:57 → 05:58

from product design.

05:58 → 06:00

So this is the core.

06:00 → 06:04

But during the year, we had a lot of additional

06:04 → 06:08

staff, a lot of QIs involved in testing.

06:08 → 06:12

We had additional people from product design.

06:12 → 06:14

We have support for back end and mobile.

06:14 → 06:20

And, of course, we have our DevOps who Built all the infrastructure.

06:20 → 06:24

So I believe it could be some something like over

06:24 → 06:26

fifteen people during the year.

06:26 → 06:27

Alright

06:27 → 06:29

then.

06:29 → 06:35

The Expo City Dubai mobile app is built using Flutter and Python.

06:35 → 06:39

Can you explain why those technologies particularly

06:39 → 06:42

were used to carry out the development?

06:43 → 06:44

Yeah. Yeah. Sure.

06:44 → 06:48

We chose Flutter for the mobile app because it allows us, know,

06:48 → 06:52

to create both Android and iOS apps using a single single call base.

06:52 → 06:56

This means we can develop faster and keep the app

06:56 → 06:58

consistent across both platforms,

06:58 → 07:01

which is very important for a project like exposed to Dubai

07:01 → 07:05

where we want the best experience for for all users.

07:05 → 07:08

We have a strong Flutter team with a great skills and

07:08 → 07:12

experience, which makes it easier to build high quality apps.

07:12 → 07:15

We also love how the Flutter community works.

07:15 → 07:16

There is a lot of support,

07:16 → 07:19

and many other companies and services are investing in

07:19 → 07:22

Flutter, which gives us, you know,

07:22 → 07:25

great tools and resources to work.

07:25 → 07:29

And this really helps us stay up to date and improve,

07:29 → 07:30

yeah, continuously.

07:31 → 07:33

And as for the back ends,

07:33 → 07:36

we used Python because it's a key technology at Merixstudio

07:36 → 07:38

where we are specialized in Python development.

07:38 → 07:41

Python is it's a powerful language that

07:41 → 07:44

helps us handle large amounts of data,

07:44 → 07:48

which is very important in this project because expose to Dubai

07:48 → 07:50

involves a lot of data gathering,

07:50 → 07:53

and we need to unify data from different sources.

07:53 → 07:55

So Python is, you know,

07:55 → 07:58

perfect for this because it has many libraries that makes

07:58 → 08:01

working with that data easier and and faster.

08:01 → 08:05

And, also, the Python's flexibility allows us to

08:05 → 08:09

scale the app and integrate it smoothly with

08:09 → 08:12

other systems such as the client CMS,

08:12 → 08:15

Contentful, and CRM, Microsoft Dynamics.

08:15 → 08:18

So this helps us ensure the app is ready for, you know,

08:18 → 08:22

future growth as part of the larger Expo City ecosystem.

08:24 → 08:28

Alright then. Thank you very much. You mentioned Python.

08:28 → 08:30

We talked a little bit about the back end.

08:30 → 08:34

So what about the third party integrations in the applications?

08:34 → 08:37

Are have we been using some of them?

08:37 → 08:40

Have they been integrated? How does it look like?

08:40 → 08:44

Data source is keep in the client CMS

08:44 → 08:46

called Contentful.

08:46 → 08:50

And I believe our first experience with the CMS

08:50 → 08:51

was pretty rough.

08:51 → 08:56

I As data structure was prepared for website support.

08:56 → 08:59

We are developing mobile app.

08:59 → 09:00

But later on during the process,

09:00 → 09:04

we came with some solutions which will suits both sides,

09:04 → 09:08

website and our mobile app development.

09:08 → 09:12

And data structure change, we propose some

09:12 → 09:15

new models rearrangement structure.

09:15 → 09:18

And I believe right now we are we are in a better place and

09:18 → 09:23

the CMS structure is better managed managed

09:23 → 09:28

on both sides, on our client side and on our side.

09:28 → 09:32

And also, we are in the process of bigger rearrangements

09:32 → 09:36

and creating more spaces, moving some structures and

09:36 → 09:40

models from one space to another to make

09:41 → 09:45

fetching the data more friendly for for us and

09:45 → 09:48

also the managing the data for easier for for our client.

09:48 → 09:51

One important integration on the mobile side is Mapbox,

09:51 → 09:54

which we use as an alternative to Google Maps.

09:54 → 09:57

So we chose Mapbox because of its flexibility and

09:57 → 09:59

customization options.

09:59 → 10:02

It allows us to customize maps and data,

10:02 → 10:06

and it also has a navigation module that helps us build a

10:06 → 10:10

dedicated navigation experience for users in exposed to Dubai.

10:10 → 10:13

And Mapbox provides a really flexible and good performing

10:13 → 10:15

map with a nice look and feel,

10:15 → 10:19

which fits perfectly with the user experience we want to deliver.

10:19 → 10:21

We did some challenges,

10:21 → 10:24

especially on the Flutter side because some features weren't

10:24 → 10:25

available natively.

10:25 → 10:28

However, thanks to Flutter's platform channels,

10:28 → 10:29

we were able to

10:31 → 10:34

we were able to handle those tasks on the native side

10:34 → 10:37

without difficulty.

10:37 → 10:40

And Mapbox also offers a tool called Mapbox Studio,

10:40 → 10:43

which lets us modify the maps and data remotely.

10:43 → 10:46

This is really helpful because we can easily update the map

10:46 → 10:50

wherever there are any changes in the expository.

10:50 → 10:52

And since Mapbox is based on the OpenStreetMap,

10:52 → 10:54

reporting changes is easier,

10:54 → 10:57

and updates are usually made within a week,

10:57 → 11:00

which is also very important for the project.

11:00 → 11:03

Alright. And thank you very much.

11:03 → 11:07

What kind of tests are performed in this project?

11:08 → 11:11

We have automated API test,

11:11 → 11:16

but also we implemented performance test using

11:16 → 11:17

tool k six.

11:17 → 11:18

Okay.

11:18 → 11:21

We get information from our client that they're expecting a

11:21 → 11:23

big traffic in the app,

11:23 → 11:28

especially in the winter time when a lot of tourists coming to Dubai.

11:28 → 11:30

So they expecting to have, like,

11:30 → 11:34

four hundred thousand people coming to to express to

11:34 → 11:35

Dubai.

11:35 → 11:40

So we we are using k six open source

11:40 → 11:43

tool to for performance testing to check,

11:43 → 11:46

to to actually simulate that kind of traffic.

11:46 → 11:50

And k six metrics measure how a system performs under

11:50 → 11:54

the, the conditions, test conditions.

11:54 → 11:57

In other, term terminology, we can say that,

11:57 → 12:01

met k six metrics measure traffic, availability,

12:01 → 12:04

and latency in the request duration.

12:04 → 12:08

So test was written to to check if our our API and

12:08 → 12:12

our infrastructure will will handle this this traffic.

12:12 → 12:15

Alright. And thank you very much.

12:15 → 12:18

Talking about traffic, talking about, let's say,

12:18 → 12:22

how the application performs, I noticed that the rendering goes

12:22 → 12:23

beautifully smoothly.

12:23 → 12:24

And

12:25 → 12:29

despite the fact that the application is enriched

12:29 → 12:33

with beautiful graphics elements and so on,

12:33 → 12:37

it goes it goes very, very smoothly.

12:37 → 12:40

What kind of activities were performed to make it happen?

12:40 → 12:43

So, yeah, this is very wide topic.

12:43 → 12:45

So Flutter is known

12:46 → 12:48

for its great performance, but there are still, you know,

12:48 → 12:53

best practices we follow to make sure everything runs efficiently.

12:53 → 12:58

So I believe that the first the one the most important is the code quality.

12:58 → 13:00

So focusing on code quality, you know,

13:00 → 13:04

such as using immutable subjects and ensuring our list

13:04 → 13:07

are lazy load that may seems like a small

13:07 → 13:08

optimization, but, you know,

13:08 → 13:10

when applied consistently across the app,

13:10 → 13:15

they can significantly improve the overall performance of the app.

13:16 → 13:17

In Flutter, everything is a widget,

13:17 → 13:21

so we made sure to structure our widget efficiently

13:22 → 13:24

to avoid unnecessary builds.

13:24 → 13:27

So using stateless widgets when possible and managing

13:27 → 13:32

state properly helped keep the app responsive.

13:34 → 13:35

Efficient image loading,

13:35 → 13:38

since images are a key part of the Xposed to Dubai app,

13:38 → 13:41

we optimized image loading by using, of course,

13:41 → 13:45

the the caching mechanism, but also

13:45 → 13:46

do not load, you know,

13:46 → 13:49

large images when it's not unnecessary

13:49 → 13:53

by helping to reduce load times and improve overall performance.

13:53 → 13:56

Of course, we are using a built in performance profiling tools

13:56 → 14:00

provided by Flutter to identify bottlenecks during

14:00 → 14:04

development, and this helps us spot areas that need

14:04 → 14:08

optimization and fix them before the release, of course.

14:08 → 14:10

And Flutter is also great for animations,

14:10 → 14:14

but complex animations can sometimes affect performance.

14:14 → 14:16

So we kept the animations

14:16 → 14:19

simple and closely monitored, you know,

14:19 → 14:23

more complex one to ensure that they didn't impact the the

14:23 → 14:25

overall performance.

14:25 → 14:29

And, you know, by following these best practices and possibly even

14:29 → 14:32

more and regularly checking the app's performance,

14:32 → 14:37

we ensure the apps runs quickly and smoothly for the users.

14:38 → 14:40

K. Thank you very much for this.

14:40 → 14:45

We work on this project for over a year.

14:45 → 14:49

What would you eventually change or reconsider

14:49 → 14:51

if you could get back in time?

14:55 → 14:58

Nothing. Everything is perfect.

14:58 → 14:59

Oh, really?

14:59 → 15:03

I believe at the beginning of the of the project,

15:03 → 15:08

we should we should go to Dubai and see expo city Dubai

15:08 → 15:11

and understand what they need, actually,

15:11 → 15:13

the the see the area.

15:13 → 15:13

Yeah.

15:13 → 15:18

So let's start the project with going on-site to to our clients.

15:18 → 15:22

Actually, I must admit that I have been discussing with our teams on

15:22 → 15:24

one or two projects.

15:24 → 15:27

Because besides smart city, we also do projects for

15:27 → 15:30

manufacturing, for renewables, for logistics,

15:30 → 15:34

and we consider as a very huge value

15:34 → 15:37

performing some, let's say, field

15:38 → 15:42

field research with the end users and and

15:42 → 15:47

within the environment that the particular project or product

15:48 → 15:49

supposed to be built.

15:49 → 15:53

However, I'm having a feeling looking back in time that

15:53 → 15:55

there's always, let's say,

15:55 → 15:58

a little bit smaller commitment at the beginning of the project.

15:58 → 16:01

And this is a bad thing because, ironically,

16:01 → 16:05

you need more commitment much more commitment in the beginning, yeah,

16:05 → 16:07

when everybody beginning to get to know each other,

16:07 → 16:10

what the product is about, what the project is about,

16:10 → 16:14

where all where all those major discoveries take place.

16:14 → 16:16

So what I would like to encourage

16:17 → 16:20

if someone is listening to us,

16:20 → 16:24

if you are planning to build something very complex like a

16:24 → 16:26

web application or mobile application,

16:26 → 16:31

we highly encourage to consider performing some field research

16:31 → 16:35

with the final groups of users, for example, in your factory,

16:35 → 16:39

in your city, in in your office building because

16:39 → 16:42

this may give us a lot of insights, and overall,

16:42 → 16:46

it will absorb not much big piece of the budget.

16:46 → 16:46

Okay then.

16:46 → 16:49

I think we're reaching our last question today.

16:49 → 16:54

So Expo City Dubai is a unique location.

16:54 → 16:54

Yeah.

16:54 → 16:56

We need to underline that there's Dubai,

16:56 → 16:59

a city in United Arab Emirates, and there's Expo City Dubai,

16:59 → 17:03

an beautiful exhibition area, which is also turning into

17:03 → 17:05

business center point,

17:05 → 17:08

collecting businesses people from all around the world.

17:08 → 17:12

Do you think that concepts may be introduced in more regular

17:12 → 17:13

environments, such as, for example,

17:13 → 17:15

European municipalities?

17:15 → 17:18

I mean, the concept of this application that we built.

17:18 → 17:20

Can could we build something

17:20 → 17:24

similar for, I don't know, city of Poznan, city of Berlin,

17:24 → 17:27

city of London, city of Geneva, Zurich?

17:27 → 17:28

What do you guys think?

17:28 → 17:32

Because the general idea behind the app is that there'll be

17:32 → 17:34

several different types of users using the app.

17:34 → 17:37

First, we started with the tourists so

17:37 → 17:40

that they want to get

17:41 → 17:44

just to know the city and just to find, like,

17:44 → 17:48

attractions and things that they are looking for.

17:48 → 17:51

But later on, in Expo Dubai,

17:51 → 17:54

there'll be also residents that will be living there.

17:54 → 17:56

They will, like, have different needs,

17:56 → 17:59

and they they want to use the app in a different way.

17:59 → 18:02

There are also people commuting every day to Expo City Dubai

18:02 → 18:04

and just working there.

18:04 → 18:07

So these are, like, the three main groups of people.

18:07 → 18:10

And one thing that separates Expo City Dubai from, like,

18:10 → 18:12

the rest of the Dubai, let's say,

18:13 → 18:16

is that it's basically a walkable city.

18:16 → 18:19

So While Dubai is being, like,

18:19 → 18:22

mostly car centric and you need the car to go basically

18:22 → 18:26

everywhere, Expo City Dubai is this new smart city that

18:26 → 18:29

you can basically just walk a few blocks,

18:29 → 18:33

and you you can drop off your kids to school and then,

18:33 → 18:35

like, go to work.

18:35 → 18:38

So this is a pretty neat concept

18:38 → 18:42

that can be applied to multiple different

18:42 → 18:46

cities in Europe or maybe in USA as well.

18:48 → 18:50

Thank you very thank you very much, Piotr.

18:50 → 18:53

First of all, thank you thank you guys.

18:53 → 18:56

I think we touched very

18:56 → 18:59

delicately lots of topics.

18:59 → 19:00

Yes.

19:00 → 19:03

We the project that we are discussing last for over a

19:03 → 19:08

year, it will be serving dozens of thousands of people who will

19:08 → 19:11

be arriving in in Dubai and also visiting

19:11 → 19:13

Expo City Dubai.

19:14 → 19:18

This is something I think we built like a foundation of a

19:18 → 19:20

smart city application that, like I said,

19:20 → 19:24

several functionalities could be considered also by different locations.

19:24 → 19:24

Yep.

19:24 → 19:28

And but, obviously, Expo City Dubai is, let's say, like,

19:28 → 19:32

one of the leaders when it comes to introducing a smart city concept.

19:32 → 19:36

I wanted to say a few words because smart city itself

19:36 → 19:40

is, let's say, like, an iteration of the city development.

19:40 → 19:43

I recently read this beautiful book,

19:43 → 19:47

seven thousand years of, history of developing

19:47 → 19:51

cities, Ben Wilson's, metropolis.

19:52 → 19:56

He's calling city in general as the biggest

19:57 → 19:59

invention that mankind ever made.

19:59 → 20:03

And the smart city concept is, let's say,

20:03 → 20:06

the most ongoing iteration, the leading iteration

20:06 → 20:08

of a city that we can actually have.

20:08 → 20:09

Yeah.

20:09 → 20:13

Digita by digitalizing several aspects of living,

20:13 → 20:17

let's say, like transportation, power consumption,

20:17 → 20:21

logistics, health care, and so on, we can, first of all,

20:21 → 20:23

limit resources that we use,

20:23 → 20:27

spend in order to make the city livable.

20:27 → 20:31

We can increase the security of the city.

20:31 → 20:34

We can increase the level of maintenance and quality of

20:34 → 20:36

services provided by the city.

20:36 → 20:40

So sometimes digital can make major

20:40 → 20:42

improvements without

20:43 → 20:46

without making a greater investments, for example,

20:46 → 20:48

in the infrastructure.

20:48 → 20:49

Karolina, Piotr, Paweł,

20:49 → 20:52

thank you very much for being with us today.

20:52 → 20:54

This was Merixstudio show.

20:54 → 20:57

It's time to talk on Expo City Dubai mobile app.

20:57 → 20:59

If you have any questions regarding this or other

20:59 → 21:02

projects made by us, feel free to drop us a like.

21:02 → 21:04

We will be super happy to talk with you soon.

21:04 → 21:06

Thank you. Have a great day.