Skip navigation

Editor's Note: This is the first in a series of interviews with leaders in the creative industry. Today, we speak with Mordy Golding, Director of Content at LinkedIn – a five-time Adobe MAX Master Presenter, and a pioneer in the development of Adobe Illustrator.

 

Interview with Mordy Golding

mordy.jpg

 

#1 What is your primary job title?

Director of Content, LinkedIn Learning

 

#2 Who or what inspires you?

My mom. And honestly, inspiration comes from anywhere, if you let it.

 

#3 What do you think about when alone in your car?

The smell of fresh-cut grass on a golf course. And playing golf. And how I don't have time to play golf much these days.

 

#4 Share a life lesson you learned?

Don't pursue the approval of others, and take open, honest, and constructive criticism.

 

#5 Favorite period of history?

I'm most fascinated by the period leading up to, during, and immediately after WWII. It's not my favorite, but it's the one I spend the most time reading about.

 

#6 What projects are you working on right now?

I could tell you, but then I'd have to kill you. Seriously though, I mainly focus on digging up data and helping my team decide what courses we should put in our library and who should teach them.

 

#7 Describe your personal style.

My creative style is "wait until the last minute and then burst forth with intense creativity". Seriously, I used to love contemporary, but folks like John McWade impressed upon me the importance of not letting your personal style bias the work you do. You need to do the research and apply the style that best fits the work you are doing.

 

#8 What tech tools do you use in your work?

On any given day, I spend most time in a web browser (i.e. gmail, google docs). The desktop tools I use most are Illustrator, InDesign, Slack, and Excel.

 

#9 When did you know you'd found your calling?

I believe one can have multiple callings. I was always interested in tech and design, but when I first saw Illustrator 88 running on a Mac Plus, I knew I could make a living doing that. I was 17. But I have since found that my true calling is teaching others. I knew I found it when I got a letter from a reader of one of my first Illustrator books. He told me he was a 52 year old welder and that my book had helped him find HIS true calling of doing design work when he got home from work.

 

#10 What's your super power?

My ability to ignore just about anyone or anything. Or so says my wife. Call me "Ignore Man"

 

#11 Peanut Butter: Creamy or Chunky?

Chunky

 

#12 What makes you happy?

Golf. Spending time with friends. Experiencing the world with my wife.

 

#13 What do you do to relax?

Read. Stare at the stars.

 

#14 Your place of birth?

New York City

 

#15 Favorite artist or art movement?

Bill Watterson. Is comic book art a movement?

 

#16 Share a funny moment from your career?

Read the 4th comment on this blog post: http://rwillustrator.blogspot.com/2006/12/ask-mordy-learning-illustrator.html

 

#17 Color of the car you drive?

Coffee

 

#18 Any new skills you'd like to learn?

Anything related to behavioral psychology. I'm fascinated by that topic. Oh, and golf. I mean, I'd like to get better at it (one would assume to do so, you'd actually need to get out and PLAY once in a while...)

 

#19 How do you get your news?

Mostly from NY Times push notifications or Facebook.

 

#20 Advice to other creatives?

Read. My friend Von Glitschka always likes to say that reading is like thinking with someone else's brain. Creativity thrives on making connections and coming up with new ideas. The more you read and more you expand your interests, the more creative you'll become.

You’ve chosen a palette of colors for your eLearning projects, so you’re done – right? Not exactly, in my view. Just picking a handful of colors doesn’t mean they will complement each other and guide the learner. What’s that you say – color can guide the learner? Absolutely, it can. Read on …

 

I’m designing a course (I always start in Adobe Illustrator but these tips apply for any application) and I have chosen this lovely green as one of the colors to use for elements (buttons, etc.) within my course.

 

Screen Shot 2016-09-23 at 4.10.10 PM.png

This green color can be useful for drawing attention to certain areas of a slide, but it can also distract the learner if overused or covering a large area. 

 

 

2.png

Here, I’ve used the green as a slide background. It’s too bright and covers too large an area for such a bright color, in my opinion.

 

 

Adjusting the color value

 

The “value” or the color – or “brightness” – can be toned down to make it more effective. Here’s how to achieve this in Illustrator.

In the Swatch panel of Adobe Illustrator (Window>Swatches), choose the color you wish to work with by doubling-clicking it.

3.png

Swatches panel in Adobe Illustrator

 

 

When I double-click on a swatch, I see the Swatch Options dialog.

4.png

In the Swatch Options dialog, you can choose to name the color and double check that it’s set to Process and RGB.

 

 

To alter the value of the color, hold down Command (Mac) or Control (Windows) and drag one of the RGB sliders. Because you held that key, the three sliders interact together and the value changes without altering the ratios. Dragging to the left darkens, dragging to the right lightens. (If you didn’t hold down that key and dragged the sliders, you would change it to a completely different color.)

 

 

 

Look at the variations I got while using this method on my green swatch. Lovely!

5.png

 

 

Next, let’s compare the original slide and the new one with the darker value. I think it works much better, is far less distracting, and below you can see I lightened the text in the final version. By making the text a light “value,” it draws more attention to it. 

6.png  7.png

8.png

 

 

 

In this example, I have three bright squares in the grid, and the rest are a dark gray.

9.png

Notice that all three squares are vying for your attention. I find it hard to focus on just one thing. Remember this when you are laying out your slides: too many bright elements can cause confusion for the learner. Always keep the focus of the slide in your sights, and design accordingly. Limit the number of brights, or adjust the values to tone down the other elements on the slide.

 

 

Value Affects Accessibility & Readability

 

And finally, the color value affects readability and can cause disabled persons to be unable to view your content. Keep it high contrast so everyone – including the disabled – can access it.

 

Persons with a visual or motion impairment using a machine called a “screen reader” to access your online content. The screen reader relays the description of the content back to the learner. If the content is too low contrast, the screen reader cannot decipher it. FAIL.

Screen Shot 2016-09-23 at 4.00.40 PM.png

Here is an example of “high contrast” which has excellent readability.

 

 

Screen Shot 2016-09-23 at 4.00.46 PM.png

This one is “low contrast,” which makes it difficult to read or translate.

 

 

Screen Shot 2016-09-23 at 4.00.53 PM.png

Red is considered by many to have negative connotations. So unless it’s part of the brand and you cannot alter it, considering darkening the value.

 

 

Screen Shot 2016-09-23 at 4.00.58 PM.png

This is a darker red, with a darker value. It still draws attention but it far less threatening to the learner.

 

 

Summary

 

In conclusion, remember to consider all factors about a color before choosing it. Ensure it works well with the other colors and be sure you have a nice mixture of bright and darker values for really effective eLearning.

 

Hope you found this information on color “valu”able!

 

Original Article on http://alt-web.com/TUTORIALS/?id=highlight_icons

The beauty of font based icons is that you can style them exactly as you would any other font with CSS color, size, borders, gradients, shadows, transitions...  Font icons re-scale nicely in responsive layouts. And unlike images, font icons have a very small footprint which means you can use a lot of them for social media and web based applications without slowing down your web pages.  If you're new to font icons, take a few minutes to get familiar with them at the links below.

 

Glyphicons - apple, ban-circle, map-marker:

Glyphicons-screenshot.jpg

Font Awesome - apple, ban, map-marker:

Fontawesome-screenshot.jpg

 

HTML:

To get started, add Glyphicons and Font Awesome links to your document's <head> tag.

NOTE: Glyphicons are included in Bootstrap CSS version 3x but not in version 4.

 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

 

Notice the slight syntax difference. Glyphicons are wrapped in <span> tags while Font Awesome icons are wrapped in <i> tags.

 

<h3>Glyphicons:</h3> 
<ul class="list-inline"> 
     <li><span class="glyphicon glyphicon-apple"></span></li> 
     <li><span class="glyphicon glyphicon-ban-circle"></span></li> 
     <li><span class="glyphicon glyphicon-map-marker"></span></li>
</ul> 

<h3>Font Awesome Icons:</h3> 
<ul class="list-inline"> 
     <li><i class="fa fa-apple"></i></li> 
     <li><i class="fa fa-ban"></i></li> 
     <li><i class="fa fa-map-marker"></i></li> 
</ul>


 

Dreamweaver Screenshots:

 

Applying multiple classes to a <span> tag:

 

Applying multiple classes to an <i> tag:

 

CSS:

Add the following CSS code to your custom stylesheet.  Feel free to experiment with different values.

 

.glyphicon {
     padding: 2%;
     color: rgba(255,255,255,1.0);
     font-size: 156px;
     -webkit-transition: all 0.35s ease-in-out;
     -moz-transition: all 0.35s ease-in-out;
     transition: all 0.35s ease-in-out;
     text-shadow: -1px 1px 2px #333;
     cursor:pointer;
}

.glyphicon:hover, 
.glyphicon:active, 
.glyphicon:focus {text-shadow: 2px 3px 15px blue;}

.fa {
     padding: 2%;
     color: rgba(255,255,255,1.0);
     font-size: 156px;
     -webkit-transition: all 0.35s ease-in-out;
     -moz-transition: all 0.35s ease-in-out;
     transition: all 0.35s ease-in-out;
     text-shadow: -1px 1px 2px #333;
     cursor:pointer;
}

.fa:hover,
.fa:active,
.fa:focus {text-shadow: 2px 3px 15px blue;}




 

And there you have it. Hope you enjoyed this brief demonstration with font icons. 

 

By Nancy O'Shea, ACP / Web Developer

Web Site: http://alt-web.com

There's rarely a sector obsessed so much with novelties as our advertising and design industry. Yet there's also rarely a business sector being so trapped in the past and clinching to old »truths« as ours. One of those traditions is the EPS file format. Many colleagues still consider (and use) it as the standard for embedding and exchanging everything in everything else.

Actually the file format hasn't been updated in this millenium. What's standard nowadays and where the fun is, is not supported in EPS: ICC color profiles and transparency.

Someone might contradict and say that an EPS saved from and opened again in Illustrator shows transparency and is fully editable.

That's brought about by the way Illustrator saves EPS (as well as other exchange formats). Most people probably know the option »Preserve Illustrator editing capabilities« when saving a PDF. When you check it, Illustrator embeds a complete AI file into the PDF (which effectively doubles file size).

Same thing happens when you save an EPS. Only you can't deactivate it, the AI part of the file will always be saved. Once you open that EPS in Illustrator, the software actually opens that AI part. You only get to see the EPS part when you open the file in any other software than Illustrator or when you place the EPS in Illustrator.

Which leads us to the selection of the EPS version. This selection actually doesn't affect the EPS, since there has never been a version higher than 3. It rather affects the version of the embedded AI part of the file. With Version »Illustrator 10 EPS« it is saved in a way that it can be opened with Illustrator 10. Objects will be converted into something that can be edited with that version. Some brushes, some kinds of transparency and some effects might still be editable afterwards. Also text stays editable under certain circumstances (e.g. it mustn't contain ligatures), although text objects often get separated into their molecules – that is single letters.


save-eps.png

The EPS part of the file can also be opened with resp. placed into lower versions of Illustrator. In the EPS part of the file everything is expanded that's not part of the EPS specification, which is pratically everything apart from basic strokes, basic fills and very basic gradients.

In case what you're after is saving a file for maximum editability, just selecting EPS might not be enough. You probably need to do various tests, for instance FreeHand can't even open EPS 10. Corel Draw from X5 up on the contrary can interpret an AI CS4 remarkably well.

What is EPS good for then? You actually only need it for compatibility with e.g. some highly specialized software in the gravure or plotting area or as lowest common denominator for exchanging very basic drawings with software that doesn't read/write anything else. Some 3D software or some font editors belong in this group.

Unfortunately most microstock agencies insist in providing files as EPS 10, although the format is practically of not too much use. On the one hand this »version 10« is only present in Illustrator, on the other hand saving to this format still ruins so much in the file that even in Illustrator it's practically ineditable.