RMRS

STANDARD OPERATION PROCEDURES (SOPs)

Importance of Using Optimized Images & Easy Way To Optimize Images

untitled-1Super important to optimize all the images before uploading them to RMRS to keep the main page weight as small as possible.

Example of importance of using optimized images and easy way to optimize each created image.

Please watch the video:

http://screencast.com/t/bUjXjh6qBG

 

The best way is to optimize images while saving.

  1. Create image \banner in Photoshop.
  2. Use File-> Save for Web and Devices or Keyboard Shotcut – Alt+Shift+Ctrl+S
  3. Choose file format as JPEG; Quality 60%saving-images
… Read the rest

SOP WordPress – How To Insert Image Banner To The Sidebar Area

sidebar-banner1. Check how wide your image should be (330px for RMRS web-site)
2. Optimize image to a lightest size possible preserving good quality
3. Create a new post or page
4. Upload the image to the post, hyperlink it if needed.
5. Switch to text mode of the editor and copy the whole code. Don’t save the post/page – just abandon it.
6. Go to AppearanceWidgets and drag and drop new ‘Text’ widget to a desired position in Primary sidebar
7. Paste the code and save. You may want to provide additional CSS class to it or/and Google Analytics even tracking code.

… Read the rest

Infographic creation SOP

Process

 

  1. Make research / read article/watch video or ask for help somebody in the team to get all the information needed.
  2. Create 1 part of the image and get early feedback on it, fix issues to get final approval.
  3. Create the rest of the elements, compose all the parts into the one graphic. (Create few options of  element placing if needed).
  4. Pay attention to wording (all titles, descriptions should be short and clear).
  5. Get a final approval at the whole infographic.
  6. Create option for videographers (1920×1080).
  7. Prepare version for Instagram (one image, or set of slides 1080×1080)
  8. Prepare version for APP (set of slides 640×960, where each step/part is shown on a new slide).

 

Rules

 

  1. All graphics should be actual and simple for understanding.
  2. All graphics should aim to be elegant.
  3. Colors should be masculine.
  4. Colors should give the right message red, yellow, orange – danger or attention; green – right decision and safety; blue – trust and calming
  5. All the distances between elements should be consistent and balanced.
  6. All the font sizes should be consistent. (2-3 font sizes for titles, subtitles etc.)
  7. Use font hierarchy: Largest and bold fold for the title, smaller and thinner fonts for the details.
  8. The font should be placed with some distance from the border to be easily read.
… Read the rest

RMRS Thumbnails creation

thumbnailsFor Most posts we need a thumbnails set.

Thumbnail set consist of

  • Youtube thumbnail
  • Tall Image
  • Featured image

 

In most cases we are using the same font for a consistant look of a website and Youtube page (Lato regular and bold)

 

Youtube thumbnail

  • Start with a white background and wording.
  • Create few options for each wording to find the perfect look of text.
  • Try to use as least words as possible
  • As usual we place wording on the left side of image, left alligned for youtube thumbnail. Text need to be visually balanced and spased.
  • Awoid making one word too much bigger from others.
  • Text should be 40% of thumbnail space. The rest 60% are for image.
  • Use font Lato (light, regular, bold)
  • Text needs to be perfectly balanced and spaced.
  • Send this images (with white background) to Travis to get a review. Make edits untill approved.
  • When text layout is approved – create 5-10 different options with photos without text.
  • Photo should be placed on the right of the thumbnail, smoothly fading to the left, and take 60% of thumbnails.
  • We can use photos from sponsors website or SM (for sponsored post); photos of Antonio (if we can find the photo with right emotions and look for the thumbnails); in worst case we can use photo from the web without face, and apply  a filter in photoshop to change image a bit.
  • Images should be high quality/size – non pixelated.
  • Get a review (which photos to use).
  • Create images with best copy and best photos (On Travis’ request)
  • Now we can bold main word, we can also add color to 1-2 word ( dark red, navy and dark green always work good).
  • We can also CAPITALISE main word if this will add balance and/or will help to fill the dead space.
  • Photo and text shoudn’t be placed to close. We can make the taxt smaller if needed.
  • We need a pay attention to balance beetween copy and image, avoid dead space or crowded look.
  •  For approved images we will use for videos – put into one archive folder and send to Jane and upload to Flickr

 

– Youtube thumbnail size is 889×500

– Use “save for web” option in photoshop with 100% quality

– Name file only with letters signs  (no punctuation marks)

– Photo should have a smoth transiton to the background. (so we … Read the rest