716030 - [Mobile] Native UI screenshots for Beta

Status: RESOLVED FIXED

(Marketing :: Design, task)

Description

[Jaclyn Fu]

For the upcoming Firefox 11 Beta release, we would like some screenshots on hand showing the new native UI). 

Can we put the screenshots into this phone body: http://farm7.staticflickr.com/6119/6390166601_9aa61ab116_z.jpg

And a couple of ones using the phone+tablet set up like on mozilla.org/mobile?

Will attach the screenshots here when ready - Thank you!

Comment 1

[Tara (musingt)]

Thanks Jaclyn, yesss we can :)  do you have the high res image of that phone already available?  If so, could you please attach?  If not, we'd need to have it professionally photographed (or we'd need to buy a version of it on stock).  Let me know.  Also, please let me know what the deadline would be.

Rhonda, I'm hoping you can help us with this :)

Comment 2

[Jaclyn Fu]

Attachment: High res image of phone

Got this from Ian Barlow - is this what you're looking for?

Comment 3

[Rhonda Spencer]

Hi guys--
yes I can help. I will just need the PSD of the phone and whatever screen shots you want to use. 

One note--please make the screen shots as large in resolution size as possible, since we often are working with a high resolution image of the phones.

:)
thanks--
rhonda

Comment 4

[Jaclyn Fu]

Hi Rhonda,

Here's the PSD file for the phone+tablet set up http://cl.ly/2g3r2M420e0d220y363t
PSD for just phone is in comment 2

Screenshots are coming your way soon! Thank you!

Comment 5

[Jaclyn Fu]

PSD file for phone and about:home http://cl.ly/1s0z3q0G0E302e2V3M1X

Comment 6

[Jaclyn Fu]

Hi Rhonda - please use the outline below for the screenshots. Thank you! 

Set 1 [using http://cl.ly/2g3r2M420e0d220y363t set up]
tablet: http://cl.ly/212u312k0T2l3Z3m1s2m
phone: http://cl.ly/1s0z3q0G0E302e2V3M1X

Set 2 [using http://cl.ly/2g3r2M420e0d220y363t set up]
tablet: http://cl.ly/212u312k0T2l3Z3m1s2m
phone: http://cl.ly/0f2v1D2s3i1i0d1z3D43

Set 3 [using http://cl.ly/1s0z3q0G0E302e2V3M1X set up] 
phone: http://cl.ly/0f2v1D2s3i1i0d1z3D43

Set 4 [using http://cl.ly/1s0z3q0G0E302e2V3M1X set up]
phone: http://cl.ly/0f2v1D2s3i1i0d1z3D43

Comment 7

[Rhonda Spencer]

Hi Jaclyn--
The screenshots/phone/tablet PNG's are here:
ftp://quasor.lunarpages.com/public_ftp/mozilla/phone_tablet_UI

I'll send you the Password and User info in a seperate email to protect from hackers.

Set 4 was a duplicate of Set 3--did you mean something different for this?
:)
--rhonda

Comment 8

[Grace Jimenez :grace]

hi rhonda, 

is the final psd this link: ftp://quasor.lunarpages.com/public_ftp/mozilla/phone_tablet_UI/phone_tablet_set1.png?

can you please post the final psd that will be implemented in bug 716029?

thanks rhonda!

Comment 9

[Rhonda Spencer]

Hi Grace--
It looks to me like the tablet/phone photo I was given to put UI screens into for this bug is different from the image I am directed to for bug 716029.

Im not clear on what you want? Do you want me to put the UI screens into the PSD in bug 716029 and post that as well as the ones I have already posted? They are two different shots of the tablet/phone I believe, so if you want the UI in the tablet/photo shot in bug 716029, I can download that and redo it.

let me know.
:)
--rhonda

Comment 10

[Jaclyn Fu]

Hi Rhonda,

Sorry just caught something - for the tablet screenshots we won't be using the new native UI anymore. 

Updated: 

Set 1 [using http://cl.ly/2g3r2M420e0d220y363t set up]
tablet: http://cl.ly/2W3W2f2Q2u282t3D3I2j
phone: http://cl.ly/1s0z3q0G0E302e2V3M1X

Set 2 [using http://cl.ly/2g3r2M420e0d220y363t set up]
tablet: http://cl.ly/2W3W2f2Q2u282t3D3I2j
phone: http://cl.ly/0f2v1D2s3i1i0d1z3D43

Thank you!

Comment 11

[Rhonda Spencer]

Attachment: phone + tablet shot set 1 PNG

Revised.

Comment 12

[Rhonda Spencer]

Attachment: phone + tablet shot set 2 PNG

Revised.

Comment 13

[Grace Jimenez :grace]

thanks rhonda.

can i get the psd for these screenshots. 
steven needs the psd version to update the screenshots in the website (bug 716029)

thanks!

Comment 14

[Rhonda Spencer]

Hey Grace--
Sure. Here are the links to download the PSDs:

http://dl.dropbox.com/u/36432639/NativeUI_aboutHome.psd.zip

http://dl.dropbox.com/u/36432639/phonetablethero.psd.zip

Let me know if you need anything else.
:)
--rhonda

Comment 15

[Jaclyn Fu]

Hey Rhonda,

Sorry we meant the PSD of https://bugzilla.mozilla.org/show_bug.cgi?id=716030#c11 and https://bugzilla.mozilla.org/show_bug.cgi?id=716030#c12.

Thanks

Comment 16

[Rhonda Spencer]

Sorry Jaclyn--
those links are only pointing me back to this thread. Im confused, as the only 2 Photoshop documents that I have relating to this project are the ones I posted above?
--rhonda

Comment 17

[Jaclyn Fu]

We would like to request for the PSD files for the images in comment 11 and comment 12 (we need the PSDs in order to implement them into the website)

Comment 18

[Rhonda Spencer]

Hi Jaclyn--
Yes, the Photoshop document that contains both of the images (one layer has the red panda phone UI, and another layer contains the Firefox UI screen for the phone, both with the red panda UI in the tablet) is the one I posted above:
http://dl.dropbox.com/u/36432639/phonetablethero.psd.zip

This is a single Photoshop document that is not flattened but that has layers. Is that what you want, or do you want 2 Photoshop flattened documents one showing the red panda UI and one showing the Firefox UI in the phone?

Thats why I was asking--the Photoshop document itself contains layers that each of these images is on.

:)
--rhonda

Comment 19

[Jaclyn Fu]

Thanks for the clarifications - would it be possible get PSD files of JUST the images from comment 11 and comment 12? I'm not very Photoshop savvy so separating them out into two different files would be awesome! :)

Comment 20

[Rhonda Spencer]

Attachment: Phone + Tablet shot FF UI

No problem--here is the flattened PSD of each. :)

Comment 21

[Rhonda Spencer]

Attachment: Phone + Tablet shot Red Panda UI

Comment 22

[Grace Jimenez :grace]

hi Rhonda, 

our developer is still having trouble accessing the psd files. 

the dropbox is giving him a 404 and the attached files are all flattened on white (they need them as distinct photoshop layers without the white background).

can we get these files asap.

our webdev team needs to update the page today in order to implement it by tomorrow.

thanks!

Comment 23

[Rhonda Spencer]

Hi Grace--
I had originally posted the layered PSD, but I think Jaclyn thought we needed flattened PSD's, so I posted those instead, hence the white background.

So here is the link to the layered PSD file. There is one layer with the FF UI for the phone and a second layer for the Red Panda screen.

http://dl.dropbox.com/u/36432639/phonetablethero.psd.zip

Please let me know if you need anything else for this.
:)
--rhonda

Comment 24

[Grace Jimenez :grace]

Hi Rhonda,

I apologize for the back and forth. 
One last thing (i promise).

the android mobile phone looks a bit small in the page: http://www-dev.allizom.org/en-US/mobile/beta/ 


can we make the android mobile phone slightly bigger:
hope the links below helps:
http://cl.ly/0g3e0r210h0R0v0u131c
http://cl.ly/3X2T0C2n2p022U0a3v07

also adding Ty. 
Ty, if you can please provide the specifics in size that would be super helpful as well.


thanks!

Comment 25

[Rhonda Spencer]

Hi Grace--
The PSD that I am working from does not have a cell phone that I can scale up in size without distorting the image and making it blurry in the process.

I do have a Galaxy Nexus phone that I can scale up and put inside the tablet/phone image you are referring to, but it isnt the same phone that is in the image currently.

I will need the cell phone as a separate file that is scalable in order to put it into the design and make it work at a larger size.

I hope that makes sense!

--rhonda

Comment 26

[Jaclyn Fu]

Would it be possible use the phone from http://dl.dropbox.com/u/36432639/NativeUI_aboutHome.psd.zip since it's larger and just insert it into the phone/tablet set up?

Comment 27

[Rhonda Spencer]

Hey Jaclyn--
Yes that is the Gallaxy Nexus phone I was referring to--I can use that, its just not the same phone that is currently in the tablet shot, but if that is OK with you, I'll use that instead.
:)
--rhonda

Comment 28

[Rhonda Spencer]

OK-- I made the phone larger, reletive to the size of the tablet next to it.

The Red Panda UI is on one layer, and if you hide that layer in PS, you will see the FF UI layer.

Here is the link to the new image:
http://dl.dropbox.com/u/36432639/phonetablethero.psd.zip

Let me know if you need anything else.
:)
--rhonda

Comment 29

[Jaclyn Fu]

Thanks Rhonda for all the help! Closing out...for now :)