Starry Night 10 animated
As a bonus below I have included a nice dreamscene file to match the browser persona and a Guide To Make Your Own Fire Fox Personas! Take Care, till next time peace and much love and have fun!
BONUS STUFF!
STAR FIELD DREAM SCENE
How to Create Your Own Persona
Personas are made up of two graphic image files - a "header" image and a "footer" image - which skin the default Firefox UI background.
- Step 1: Creating a Persona Header Image
- Step 2: Creating a Persona Footer Image »
- Step 3: Testing your Persona Images »
- Step 4: Submit your Persona! »
Step 1: Creating a Persona Header Image
The header image is displayed as the background of the top of the browser window, nestling in behind the toolbars, address bar, search bar and the tab strip. It will be anchored to the top-right corner of the browser window. 
- Dimensions should be 3000px wide x 200px high
- PNG or JPG file format
- subtle, soft contrast images and gradients work best
- highly detailed images will compete with the browser UI
- Firefox may reveal more of the lower portion of the image if it or an extension adds another toolbar or other UI element to the top of the window
- the right-hand side of the image should have the most important information - as a user increases the width of the browser window, the browser reveals more of the left-hand side of the image
- images must be no larger than 300kb in filesize
- images over 3000px x 200px will not be approved
- never use artwork/logos/photography that you do not have the legal rights to use
Step 2: Creating a Persona Footer Image
The footer image is displayed as the background of the bottom of the browser window, behind the status and find bars. It will be anchored to the bottom-left corner of the browser window. 
Step 3: Testing your Persona Images
In general, designs that feature rich content areas in the top-right corner of the browser work best. Though that may be true, you should always check to see where the UI elements sit on top of your designs within the different platform versions of Firefox.
This may be a critical step in finalizing your image, depending on the importance of the visual information you are including in your designs.
Follow these four steps to get the Custom Personas option up and running in your browser:
This may be a critical step in finalizing your image, depending on the importance of the visual information you are including in your designs.
Option 1: Test on Your Own Computer
Within the Personas menu in the bottom left of the browser's status bar, you can enable an "offline" Persona on your own personal computer by enabling a setting within Preferences. In doing this, you can test your Personas before submitting them to the online catalog.Follow these four steps to get the Custom Personas option up and running in your browser:
- If you have Personas installed, click on the little fox on the bottom left of your computer screen and click on "Preferences"
- Ensure the box "Show Custom Persona in Menu" is checked and close the box.
- Click on the little fox again. Mouse over "Custom" in the menu and to the right find and click "Edit"
- Build your Persona using the upload fields and additional settings.
- Once your images are playing nice with the UI for all the OS flavors of Firefox, save final copies (PNG or JPG) - but be sure to check to ensure they don't exceed 300k in filesize!. (Note: This will only test your Persona on the platform you are currently using)
Option 2: Cross-Platform Photoshop PSD Header Template
We've created a positioning template that can be used to help figure out placement of your artwork. The template is structured to allow testing of your Persona header within OSX, Windows XP and Windows Vista flavors of the browser.
The key to using this PSD template is to simply layer your Persona header image underneath one of the three OS layers. Be sure to turn off any of the OS layers you aren't using, as they will overlap each other due to their transparency.
Photoshop overlay layerset
- Once you turn on an OS layer, you will be able to see where the UI elements will sit on top of your designs and you can flag any conflicts that may arise.
- Once your images are playing nice with the UI for all the OS flavors of Firefox, save final copies (PNG or JPG) - but be sure to check to ensure they don't exceed 300k in filesize!
Step 4: Submit your Persona!
Now that you have finalized the artwork, it is time to share! One thing to note, please do be sure that you have the rights to use whatever image or design you use in your Persona. (We don't want to get any nasty lawyer letters!)
Follow the link below to start the process and add your creations to the constantly growing catalog of Firefox Personas!
Follow the link below to start the process and add your creations to the constantly growing catalog of Firefox Personas!
Did you know you can test a Persona before you submit it? Find out how!» Online Image Editor Resources- SUMOPaint - SUMO Paint offers professional and easy to use tools for creating and editing images within a browser. SUMO Paint is a free image editing software that gives you the opportunity to create, edit and comment images online with powerful tools and layer support.
- Photoshop.com - Tweak, rotate and touch up photos with Photoshop® Express, your free online photo editor.
- Aviary Phoenix - All the Photoshop features you actually need, at a fraction of the price. Did we mention built-in collaboration? Create and edit with the world!
No comments:
Post a Comment