0
1
00:00:00,720 --> 00:00:08,250
So the first thing is going back. And there's a main differentiation between this navigation button because
1

2
00:00:08,310 --> 00:00:16,800
on Android on the left it is a hardware button and on iOS it tends to be placed in the top left corner.
2

3
00:00:16,800 --> 00:00:22,600
Now these two buttons even though they both essentially navigate back,
3

4
00:00:22,740 --> 00:00:31,310
they actually work quite differently because on Android the nav back button is a time based navigation.
4

5
00:00:31,410 --> 00:00:37,620
So it will take you to the previous screen that you saw. Just like when you're on a website when you
5

6
00:00:37,620 --> 00:00:38,660
click the back button
6

7
00:00:38,670 --> 00:00:41,880
it'll take you to the previous web page, on Android
7

8
00:00:41,880 --> 00:00:50,760
the nav back button takes you to the previous screen historically in time. But on iOS the nav back button
8

9
00:00:51,090 --> 00:00:57,750
is not navigating back in time but it's actually navigating up the hierarchy.
9

10
00:00:57,750 --> 00:01:03,750
So the equivalent would be say if you went from the home page to a particular page then from that page
10

11
00:01:03,750 --> 00:01:07,330
you navigated to another page on the same hierarchy.
11

12
00:01:07,350 --> 00:01:13,440
When you click the back button when you're on this page instead taking you back over here, the back button on
12

13
00:01:13,520 --> 00:01:21,030
iOS would take you up hierarchically i.e. it would take you back to the parent screen or the homescreen
13

14
00:01:21,030 --> 00:01:21,740
in this case.
14

15
00:01:21,750 --> 00:01:27,470
So it's really important to think about how you're going to design your app in terms of its navigation
15

16
00:01:27,600 --> 00:01:32,370
taking into account these differences. Next is navigation.
16

17
00:01:32,370 --> 00:01:38,350
Now we mentioned this briefly about tab bar controllers versus the hamburger menu.
17

18
00:01:38,370 --> 00:01:44,220
Now the hamburger menu is so called because somebody thought that the three lines make it look like
18

19
00:01:44,250 --> 00:01:45,370
a hamburger.
19

20
00:01:45,660 --> 00:01:47,440
Now you may or may not disagree.
20

21
00:01:47,520 --> 00:01:52,320
But essentially one of the most common ways that you'll see navigation occurring in Android apps is
21

22
00:01:52,320 --> 00:01:53,820
through these hamburger menus
22

23
00:01:53,850 --> 00:01:59,460
and when you tap on them, a menu slides out and you can pick and choose which screens you want to go
23

24
00:01:59,460 --> 00:02:00,000
to.
24

25
00:02:00,150 --> 00:02:01,450
And on iOS,
25

26
00:02:01,530 --> 00:02:08,490
traditionally it's been done using a tab bar controller which resides at the bottom and it can only contain
26

27
00:02:08,550 --> 00:02:15,600
a maximum of five items because otherwise it would be hard for the thumb to actually navigate it.
27

28
00:02:15,600 --> 00:02:21,870
Now this brings up a point of contention because a lot of designers really hate this hamburger
28

29
00:02:21,870 --> 00:02:28,980
menu style and with good reason. Because with that button they even though you know that the menu is
29

30
00:02:28,980 --> 00:02:35,520
accessible with just a single tap, as with all things human, when it's out of sight it's out of mind. And
30

31
00:02:35,520 --> 00:02:41,620
users don't tend to think to look into it when they need a certain functionality.
31

32
00:02:41,640 --> 00:02:49,020
And so a lot of designers have gravitated to a slightly different design pattern for Android navigation.
32

33
00:02:49,020 --> 00:02:55,380
And, instead you see a lot of designers implementing something a bit like this where you've got a tab
33

34
00:02:55,410 --> 00:02:59,930
bar by swiping left all right you can navigate between the different screens.
34

35
00:02:59,940 --> 00:03:02,980
An example of that is the Twitter app on Android.
35

36
00:03:03,060 --> 00:03:04,740
So have a look at that
36

37
00:03:04,950 --> 00:03:07,800
if you're interested in implementing this in your app.