1
00:00:04,800 --> 00:00:15,860
One I guess we're going to keep cranking away on this saved tab you might think that we're pretty much

2
00:00:15,860 --> 00:00:22,700
wrapped up here but believe it or not there is a couple of instances in which we need to take care of

3
00:00:23,440 --> 00:00:25,520
that we haven't thought of yet.

4
00:00:25,520 --> 00:00:30,200
So first of all let's go ahead and rename this art board.

5
00:00:30,220 --> 00:00:37,310
We'll call it saved job postings.

6
00:00:37,520 --> 00:00:45,110
This is looking good and hopefully you guys have filled in the circles for where the people's faces

7
00:00:45,110 --> 00:00:47,980
are supposed to go and change the names.

8
00:00:48,290 --> 00:00:49,550
And the big amounts.

9
00:00:49,730 --> 00:00:53,450
Since you guys are better product people than I am.

10
00:00:53,480 --> 00:00:56,440
You guys are probably finished it by now.

11
00:00:56,580 --> 00:01:00,190
But go ahead and do that in a little bit.

12
00:01:00,200 --> 00:01:04,170
So here is the Save Jobs postings.

13
00:01:04,280 --> 00:01:14,990
So if you click this we could have a dropdown but there's only one other option to have.

14
00:01:14,990 --> 00:01:20,540
So this is also kind of personal preference but it's something to think about what exactly happens when

15
00:01:20,540 --> 00:01:23,010
you click this right.

16
00:01:23,240 --> 00:01:24,380
You could have a dropdown.

17
00:01:24,440 --> 00:01:30,510
Maybe you're anticipating more types of modes per se.

18
00:01:30,560 --> 00:01:38,830
Or you could just rotate this arrow and kind of have it point to the right and then as you click it

19
00:01:38,840 --> 00:01:47,060
maybe the text can animate off the navigation and it'll turn into saved producers or something to kind

20
00:01:47,060 --> 00:01:49,860
of indicate that you're in a different mode you're changing.

21
00:01:50,330 --> 00:01:54,850
And these are the sort of things you want to be thinking about as you're building it out right.

22
00:01:54,910 --> 00:01:58,730
Tappet How does the user know you're in a whole different area.

23
00:01:58,730 --> 00:02:00,130
This list is new.

24
00:02:00,260 --> 00:02:06,620
Maybe the table view even swipes off the screen as the new one comes on.

25
00:02:07,250 --> 00:02:10,480
All really really nice user experience ideas.

26
00:02:10,490 --> 00:02:14,100
So we have the same job postings.

27
00:02:14,140 --> 00:02:15,340
It looks good.

28
00:02:15,650 --> 00:02:17,690
Let's do some cleanup here.

29
00:02:17,740 --> 00:02:30,740
I'm going to I'm going to change this to post cell to and I am also going to change this instead of

30
00:02:30,760 --> 00:02:33,100
post details or just call this post cell one

31
00:02:35,900 --> 00:02:40,530
and this can be Post cell free right.

32
00:02:42,820 --> 00:02:43,100
All right.

33
00:02:43,160 --> 00:02:46,570
So the first thing is take note about how you want to handle this.

34
00:02:46,640 --> 00:02:51,030
This UI interaction or this or you actually interaction.

35
00:02:51,500 --> 00:02:57,500
And the second thing is let's go ahead and create our saved a producer table view.

36
00:02:57,500 --> 00:03:07,270
So I am going to just hold down option click and drag and I am actually no let's put it right next to

37
00:03:07,270 --> 00:03:08,320
it side by side.

38
00:03:08,550 --> 00:03:09,390
That would be fine.

39
00:03:11,290 --> 00:03:14,880
And let's rename our boy we'll call it saved.

40
00:03:14,890 --> 00:03:15,720
Producers

41
00:03:20,080 --> 00:03:30,950
and we'll go ahead and jump in here and retype this to say saved producers we might need to do a little

42
00:03:33,290 --> 00:03:42,770
bring our Are triangle in grab our title centered horizontally and then like or the other one and offset

43
00:03:42,770 --> 00:03:48,230
it a couple of points looks good.

44
00:03:48,240 --> 00:03:57,720
All right so if we go back to our feed what some things that might have caught our eye when we saved

45
00:03:57,810 --> 00:03:59,440
a producer right.

46
00:03:59,450 --> 00:04:01,790
Could be a featured song could be there.

47
00:04:01,820 --> 00:04:06,670
John-Roger the the name of the picture.

48
00:04:06,690 --> 00:04:12,100
Maybe we'll definitely want the picture and the name.

49
00:04:12,290 --> 00:04:26,880
What I think would be really really cool is if we somehow had the featured song in there I don't know.

50
00:04:27,050 --> 00:04:27,470
We'll see.

51
00:04:27,470 --> 00:04:34,840
It wouldn't be too much that's left to grab out of here but let's go ahead and let's start with the

52
00:04:34,840 --> 00:04:36,520
picture and the name.

53
00:04:36,520 --> 00:04:42,690
So let's get rid of this other post cells.

54
00:04:42,720 --> 00:04:43,890
So we have the picture in here.

55
00:04:43,920 --> 00:04:46,110
First and last name.

56
00:04:47,160 --> 00:04:56,840
I am going to omit the description or I guess whatever the bio is going to be from the profile.

57
00:04:57,300 --> 00:05:02,370
I think going back to are are three questions that we had in the beginning about our product and who's

58
00:05:02,370 --> 00:05:03,790
going to be using it.

59
00:05:04,080 --> 00:05:08,900
If you're a musician I think the music speaks louder than words.

60
00:05:09,540 --> 00:05:15,930
And I would much rather listen to a song of someone's work and get to know them that way in 30 seconds

61
00:05:15,950 --> 00:05:17,580
and having to read some sort of bio.

62
00:05:17,580 --> 00:05:27,690
So I'm going to omit this part and let's just add the song me.

63
00:05:27,720 --> 00:05:30,270
So maybe all we could do.

64
00:05:30,550 --> 00:05:35,040
Also get rid of the bit as let's add the genre.

65
00:05:35,040 --> 00:05:36,810
I think that's important.

66
00:05:37,440 --> 00:05:42,360
So genre could be.

67
00:05:43,170 --> 00:05:49,580
Well first let me make it our audio tangle orange

68
00:05:55,280 --> 00:06:03,390
and I am going to bring this into our Post's name and description for there so it can interact nicely

69
00:06:03,390 --> 00:06:04,980
with our first and last name.

70
00:06:04,980 --> 00:06:05,940
I'm going to

71
00:06:09,050 --> 00:06:11,930
make sure it's aligned properly.

72
00:06:12,260 --> 00:06:16,410
Looks like it's a little off something a line and left.

73
00:06:16,630 --> 00:06:21,290
I'm going to make sure this is still 20 away from our oval.

74
00:06:21,290 --> 00:06:21,650
So

75
00:06:25,770 --> 00:06:26,620
it looks good.

76
00:06:30,850 --> 00:06:39,010
So I'm going to take the name and let's just rename this to genre and with her selected I'm going to

77
00:06:39,010 --> 00:06:42,090
center it vertically or align vertically

78
00:06:45,680 --> 00:06:46,960
so that's great.

79
00:06:46,960 --> 00:06:53,180
And then lastly what we can do since we don't have this big up here that's taken up all this space like

80
00:06:53,180 --> 00:06:58,380
it was the last time we can scoot the subject a little bit.

81
00:06:58,850 --> 00:07:05,700
And so we have room for maybe our little play band so

82
00:07:08,810 --> 00:07:10,430
let's see here.

83
00:07:12,170 --> 00:07:14,530
Where do you think we should put the blame on.

84
00:07:14,690 --> 00:07:15,850
Let's make this a little bigger.

85
00:07:15,860 --> 00:07:26,210
You got some room to work with.

86
00:07:26,460 --> 00:07:31,130
And let's go ahead and snap this line back down to the bottom of the rectangle

87
00:07:33,740 --> 00:07:34,970
and what we can do.

88
00:07:35,180 --> 00:07:44,210
I feel like it might be a little too busy to have two circles side by side or if you don't want the

89
00:07:44,480 --> 00:07:46,700
circle you can just have a triangle as a play band.

90
00:07:46,700 --> 00:07:51,230
But I'm going to go ahead and grab the circle play button from the feed

91
00:07:55,270 --> 00:07:59,080
with this one drill down.

92
00:07:59,090 --> 00:08:07,750
I'm going to copy it copy in play button jump back over to the same page read my post so I'm going to

93
00:08:07,750 --> 00:08:09,100
paste that right in there.

94
00:08:10,000 --> 00:08:13,150
And it is ginormous I'm going to bring it down.

95
00:08:15,340 --> 00:08:19,020
We see thirty three looks good

96
00:08:23,560 --> 00:08:30,380
and I'm going to have it on on this side so that way you know if if we had it over here I think it would

97
00:08:30,380 --> 00:08:31,070
be fine.

98
00:08:31,070 --> 00:08:32,440
To be honest.

99
00:08:32,880 --> 00:08:35,940
But ideally right.

100
00:08:35,980 --> 00:08:41,530
If you say producers you might want to click on their picture or their name to jump to their profile.

101
00:08:41,530 --> 00:08:45,450
I don't want people accidentally clicking the play button or vice versa.

102
00:08:45,460 --> 00:08:53,050
I think it's best to have it out of the way a little bit so that if it's a user's clicking play it means

103
00:08:53,140 --> 00:09:00,820
100 percent that they're clicking play they want to hear something and there's no discrepancy or confusion

104
00:09:00,850 --> 00:09:02,670
as to what they're trying to do.

105
00:09:02,680 --> 00:09:10,840
So let's make sure that this is roughly 20 20 points away from the right which looks like it is looks

106
00:09:11,440 --> 00:09:22,110
good and we can have the name of the song come out and be right aligned.

107
00:09:22,120 --> 00:09:24,470
So go ahead and insert text.

108
00:09:24,760 --> 00:09:28,350
Click the right aligned and just type.

109
00:09:28,720 --> 00:09:30,350
Let's make up a song name Stu

110
00:09:34,590 --> 00:09:35,880
cream soda.

111
00:09:35,880 --> 00:09:40,120
And Friday Night Lights.

112
00:09:40,350 --> 00:09:42,160
And this is also remix.

113
00:09:42,210 --> 00:09:44,900
For some reason I don't know.

114
00:09:44,970 --> 00:09:49,110
So let's go ahead and italicize it.

115
00:09:49,110 --> 00:09:51,540
I think that a look really cool.

116
00:09:51,540 --> 00:09:57,540
I mean the lower the size to around 13 I don't want it to be the same size as the genre in the first

117
00:09:57,540 --> 00:09:59,030
and last name.

118
00:09:59,280 --> 00:10:04,890
And also most likely these could get a little long so I want to count for that.

119
00:10:05,950 --> 00:10:16,530
And I'm going to make the color gray and I'm going to align it with I play a button maybe 10 10 points

120
00:10:16,530 --> 00:10:17,570
away.

121
00:10:18,390 --> 00:10:21,560
And with these you selected you guys know the Joe now.

122
00:10:21,800 --> 00:10:28,050
So I can really quickly we're getting to align it and then controlled you to group it and this will

123
00:10:28,050 --> 00:10:35,990
be our play button and song awesome.

124
00:10:36,640 --> 00:10:41,630
And for some reason this isn't in our post Selous go ahead and throw that in there.

125
00:10:43,770 --> 00:10:44,610
And

126
00:10:47,840 --> 00:10:48,530
let's see.

127
00:10:48,620 --> 00:10:57,740
Lastly all we could do is still have that that play bar that showed how far along it was in the songs.

128
00:10:57,770 --> 00:10:59,760
Let's go ahead and grab this.

129
00:11:00,110 --> 00:11:07,520
Let's drill down and I'm just going to copy this over command see the copy and go back over it saved

130
00:11:09,350 --> 00:11:10,790
go to our post sell it.

131
00:11:10,840 --> 00:11:12,730
Go ahead and paste that right in there.

132
00:11:19,490 --> 00:11:20,830
That looks great.

133
00:11:20,840 --> 00:11:33,250
I am also going to put this in the play button and song so those are grouped together.

134
00:11:35,700 --> 00:11:49,330
And now we can just rename this actually play button assets or play assets song assets.

135
00:11:49,340 --> 00:11:51,410
All right so that looks really really nice guys.

136
00:11:51,450 --> 00:11:56,050
It's spaced out really really well right out the gate.

137
00:11:59,340 --> 00:12:01,100
I think that's really cool.

138
00:12:02,810 --> 00:12:10,320
And so go ahead maybe copy this twice maybe be a good one.

139
00:12:10,670 --> 00:12:17,760
We might have to go back in maybe Swapan these out for a play or maybe it's Pazner ready now.

140
00:12:17,990 --> 00:12:19,510
But let's just delete one of these

141
00:12:23,590 --> 00:12:28,520
and you guys can go ahead and change the names of these again.

142
00:12:28,540 --> 00:12:35,080
Fill fill this in fill in the pictures the names we have save producers.

143
00:12:35,080 --> 00:12:36,460
Save job postings.

144
00:12:36,460 --> 00:12:42,250
This is looking like a super clean professional at this looks like you guys are building stuff that

145
00:12:43,000 --> 00:12:52,870
I've seen being pitched to VCs and angels for seed rounds and to be quite honest a lot of times their

146
00:12:52,870 --> 00:12:55,150
products are less thought out.

147
00:12:55,210 --> 00:13:03,580
They don't go down this route of going over every single detail and somehow they're still they're still

148
00:13:04,300 --> 00:13:09,160
raising money and they're going to find out sooner than later that they should have thought of it and

149
00:13:09,160 --> 00:13:11,760
they're going to spend a lot of time and money fixing things.

150
00:13:11,760 --> 00:13:15,160
And so this is good.

151
00:13:15,160 --> 00:13:24,700
So the last thing we need to do is handle what happens if there aren't any save jobs or save producers

152
00:13:24,700 --> 00:13:25,870
right.

153
00:13:26,200 --> 00:13:32,770
If you're a new user and you've glanced at the feet and you're like what's this save tab for you may

154
00:13:32,770 --> 00:13:38,620
not put two and two together and you always want to default to the assumption that the user is not going

155
00:13:38,620 --> 00:13:41,250
to put two and two together.

156
00:13:41,740 --> 00:13:47,200
So what I think would be really cool is let's go ahead.

157
00:13:47,200 --> 00:13:56,110
Well let's go ahead and copy our Save Jobs posting the whole down option and drag it all the way down.

158
00:13:56,740 --> 00:14:02,340
And I'm just going to get rid of these cells and delete them.

159
00:14:02,950 --> 00:14:11,920
And what I like to do for these these kinds of screens is have a little fun with it.

160
00:14:11,950 --> 00:14:20,470
Make it light and animated but also give the user an idea of what's supposed to go in there.

161
00:14:20,470 --> 00:14:29,010
So what we could do is answer some text and say something like.

162
00:14:33,020 --> 00:14:39,880
You haven't saved any job postings yet.

163
00:14:44,530 --> 00:14:52,680
And I'm going to centerline line this and instead of italic I'm going to choose light I'm going to boost

164
00:14:52,680 --> 00:14:55,370
the size a pretty significant when.

165
00:14:55,380 --> 00:14:58,210
Let's go Ooh that's way too big.

166
00:14:58,230 --> 00:15:00,590
Let's scale this.

167
00:15:00,600 --> 00:15:03,080
Bring this back I'm going to go twenty 23 for now.

168
00:15:06,780 --> 00:15:13,230
Actually for now you go to maybe 15 or 16.

169
00:15:13,370 --> 00:15:21,980
And what we can do is have some sort of message messaging that alludes to what it is and how they can

170
00:15:22,250 --> 00:15:23,540
get involved with it.

171
00:15:23,540 --> 00:15:27,400
So you know you haven't saved any job postings yet.

172
00:15:27,510 --> 00:15:44,400
We could insert another text that says save posts from the feed.

173
00:15:44,630 --> 00:15:46,060
And I don't know.

174
00:15:46,060 --> 00:15:47,620
Reference them later or something right.

175
00:15:47,620 --> 00:15:55,320
So save posts from the fee to keep tabs on them.

176
00:15:55,540 --> 00:15:55,830
Right.

177
00:15:55,840 --> 00:16:03,930
So it alludes to why you know this is blank and then it kind of gives them a call to action.

178
00:16:03,940 --> 00:16:05,900
You know this is how you kind of get started with this.

179
00:16:05,890 --> 00:16:16,020
With this whole area what I'm going to do is make this a little bigger in my opinion this might be a

180
00:16:16,020 --> 00:16:17,620
little too wordy.

181
00:16:17,850 --> 00:16:27,720
You'll probably want to consolidate consolidate this excuse me into one one line but I'll leave that

182
00:16:27,720 --> 00:16:30,450
up to you guys you know it's good exercise for you.

183
00:16:30,450 --> 00:16:34,930
Think about how you want to say what you want to say.

184
00:16:36,720 --> 00:16:39,150
And so let's choose one of these for now.

185
00:16:39,150 --> 00:16:50,160
Just as an example I like this one so I'm going to get rid of this and I find that using a lighter style

186
00:16:50,160 --> 00:16:53,630
text and then blowing them up big.

187
00:16:54,010 --> 00:16:59,700
It works really well and it gives it a nice clean modern feel which is what we're going for.

188
00:16:59,700 --> 00:17:01,440
So let's do that.

189
00:17:01,470 --> 00:17:06,250
And then what I also like to do is add a graphic in here some sort.

190
00:17:06,250 --> 00:17:09,900
So I've been empty let's see

191
00:17:12,530 --> 00:17:13,740
see what comes up.

192
00:17:15,870 --> 00:17:25,430
Or this confronted we would say nothing nothing What's a good that looks kind of more and I want to

193
00:17:25,430 --> 00:17:30,860
put a skull there or we can put a desert.

194
00:17:30,940 --> 00:17:32,130
I wonder if there is a

195
00:17:37,920 --> 00:17:38,670
cool little

196
00:17:42,660 --> 00:17:42,980
does.

197
00:17:43,030 --> 00:17:48,160
Well I mean at any rate you know since we're is it's music that we might be able to put like an empty

198
00:17:48,160 --> 00:17:49,990
stage or something.

199
00:17:49,990 --> 00:17:52,710
I mean you guys get it right.

200
00:17:52,710 --> 00:17:58,050
So maybe this one will see how this looks.

201
00:17:58,050 --> 00:18:09,920
I'm going to drag this over and of course it is like a thousand points and points to go ahead and double

202
00:18:09,920 --> 00:18:10,580
click to go in.

203
00:18:10,590 --> 00:18:20,720
Adam let's get rid of this text and I'm going to make it like a gray something to keep it light.

204
00:18:26,600 --> 00:18:31,690
Maybe we could even say you know like nothing's here or something.

205
00:18:34,800 --> 00:18:37,240
Sad face.

206
00:18:37,640 --> 00:18:39,110
Nothing's here yet.

207
00:18:41,350 --> 00:18:44,330
We'll bring this down down to 16

208
00:18:47,160 --> 00:18:48,230
pages in the middle.

209
00:18:48,230 --> 00:18:54,360
You guys can go ahead and play around with this but this is kind of the general feel that you want you

210
00:18:54,360 --> 00:18:56,700
know the user comes here for the first time.

211
00:18:56,840 --> 00:18:59,130
OK I understand there's nothing here.

212
00:18:59,130 --> 00:19:01,190
How do I get involved.

213
00:19:01,260 --> 00:19:03,810
Keep it light keep it fun.

214
00:19:03,960 --> 00:19:06,640
Once you're done you go ahead and group it.

215
00:19:07,020 --> 00:19:09,680
You say nothing.

216
00:19:10,560 --> 00:19:16,590
And then you know just center it smack dab in the middle of the screen.

217
00:19:17,560 --> 00:19:20,240
And yeah it's looking really really good.

218
00:19:20,250 --> 00:19:22,270
Let's go ahead and rename this as well.

219
00:19:22,590 --> 00:19:24,210
Job postings.

220
00:19:31,060 --> 00:19:37,380
So go ahead and think of one for the same producers.

221
00:19:37,430 --> 00:19:39,170
It could be the same.

222
00:19:39,170 --> 00:19:41,140
It could be something different maybe.

223
00:19:41,390 --> 00:19:48,610
Maybe you have like an eye kind of a producer or something and it's maybe like a little witty more witty.

224
00:19:48,620 --> 00:19:50,360
Call the action.

225
00:19:50,360 --> 00:19:53,650
Like start saving producers and start being embalming.

226
00:19:53,680 --> 00:19:57,360
Get your music career off the ground something of that nature.

227
00:19:57,370 --> 00:20:00,960
But yeah go ahead and do that.

228
00:20:00,980 --> 00:20:05,980
Once again no shame in diving this deep into the details.

229
00:20:06,290 --> 00:20:13,100
You are going to have to think of it sooner than later and it's way easier to do it before any code

230
00:20:13,100 --> 00:20:19,820
is written because as a developer it gets annoying I have to go back and do stuff that I haven't thought

231
00:20:19,820 --> 00:20:20,420
about.

232
00:20:20,600 --> 00:20:27,200
And if you're handing it off to a developer I swear to you they're going to come back and want to beat

233
00:20:27,200 --> 00:20:31,820
you up for making them rewire a bunch of stuff that they already did.

234
00:20:31,820 --> 00:20:34,730
So it's looking amazing guys.

235
00:20:34,790 --> 00:20:36,710
I'll see you guys in the next video.
