All right.
Welcome back.
So in this video, we're going to design the podcast page for our app.
So let's go to the LERN app design folder and click on podcast, where we already have the interface
mapped out here for the header and the footer.
What we're gonna do next is we're going to go to the desktop.
And go to the five page app design folder.
And right, click on podcast and open with Photoshop 20-20.
OK.
So this is going to be similar to the other.
Content that we did for the homepage, what we're gonna do is we're just gonna grab.
We're trying to fit both of them in there.
So let me see if I can do that.
So let's grab the marquee tool here with the M and just highlight over the title here and then hit control,
see the podcast out BSD and then control V to pace that M.
And I'm going to line it up right here and then I'm going to hit control tea so we can drag it out a
little bit.
And then let's put it there.
OK.
And then let's hold control to see where we're at in terms of width and height.
And so you can see to the right one hundred eighty two pixels, the margin on the right and on the left,
it's 187.
Now it's one eighty six and one eighty five.
I'd say that's good right there.
Then what I'm going to do is I'm going to grab the creative cloud thumbnail with the marquee to also
hit the letter M on your keyboard here and then highlight that thumb now.
And I control C, control V to paste it.
And what I'm going to do is I'm going to put it right there and we'll have control tea and then drag
this out and hold shift.
OK.
And then what I'll do is I'll bring us over.
Right there.
And then we're going to hit control to see where we're at.
Exactly one oh seven on both sides, perfect.
And then we are 46 pixels from the title.
So I want to be 50 pixels from the title.
There you go.
So we're 52 to forty nine.
We'll leave it at 52.
Now, what we can do is we can bump both of these up because we are one hundred and seven pixels from
the nav.
So what I want to do is I want to be 50 pixels from the nav.
So you just put your cursor by where you want to compare.
And then slowly move it up inch by inch, pixel by pixel.
That way you can maximize your space here.
OK.
Then what we can do.
As we can come back here and the first thing I want to do is I want to erase this because this was from
my
copying skills.
OK, so that's the wrong color.
Someone to do an eyedropper here and then, I mean, grab the paint brush and paint that out.
OK.
And then what I'm going to do is I'm going to grab a title here.
With a marquee to also hit the keyboard.
Letter M.
And then had control see to copy and then control V to paste.
And then what I'm gonna do is I'm going to bring this up to here and line it up with the.
Other title that we have, just to make sure that it were close to the same size so you could see we're
a little big.
I'm going to hold shift.
So it comes down a little bit.
And there you go.
So we are close to the same size and we're gonna go about right here and just see where we're at in
terms of distance between that one and this one.
So we're about 91 pixels from the bottom of the thumbnail.
So what I'm going to do is I'm gonna make it one hundred pixels just to give us some space.
And then I'm going to go get the thumbnail.
So let's grab the marquee tool again right here.
And I'm in it control, see?
And control Vyatta paste.
And then we're gonna bring this up to read to there.
And just line it right up with the existing thumbnail and then just bring it right there and we're gonna
bring it down and will line it up nicely right there.
And let's see.
That looks so pretty darn good right there.
And there you go.
So now we have simplified content where we're 100 hundred pixels.
Well, before I start saying that, me make sure we are 50 pixels from the top and we are.
One hundred pixels from each other were separated by one hundred pixels, which is fine.
I actually think that looks pretty darn good.
All things considered.
So what I'll do is I will kind of zoom in a little bit just so you can see.
So the menu will stay the same over here.
And then you have a play button here for the podcast.
And then the same one right here.
And then if there is more content, of course, you'd scroll down.
And if you got more content than this, what I recommend doing is don't put too much content on one
page when it's a mobile app or mobile version of the site.
Because what that does is you're going to be scrolling forever and you don't want to do that.
So what you want to do is add pagination.
So basically you'd have.
Two podcasts or two blogs per page.
And then you'd have pagination right here and then it would go to the next page for the next blog or
next podcast or whatever you got.
That way it's simple.
And the users engaged.
OK.
So there you go.
All right.
Thanks for watching.
I'll see in the next video.