Jump to content
Slate Blackcurrant Watermelon Strawberry Orange Banana Apple Emerald Chocolate Marble
Slate Blackcurrant Watermelon Strawberry Orange Banana Apple Emerald Chocolate Marble

Rss Bot

Members
  • Content Count

    19,839
  • Joined

  • Last visited

    Never
  • Feedback

    N/A

Posts posted by Rss Bot


  1. You're reading How to Send Emails That Your Subscribers Will Love, originally posted on Designmodo. If you've enjoyed this post, be sure to follow on Twitter, Facebook, Google+!

    How to Send Emails that Your Subscribers will Love

    To develop a strong business, you must develop a good relationship with clients. This doesn’t just mean promoting an excellent product or service. It is also important to stay in touch once the sale is complete. One way of doing this is to send customers regular email newsletters. If you want to offer the most […]


    img.php?z=1260473&k=7c274c44627d36b4e9e9

    Fe4pyKAPLJo

    View the full article


  2. In typography, as in grammar, there is no objective ‘right’ way to do things; there are just conventions, and these conventions change over time. And what's more, while we could argue that the examples we're about to give are indeed mistakes – that is, things that are wrong – it's also true that there are often technical or style reasons to make them deliberately (we do on Creative Bloq all the time). But enough with the caveats. 

    Bonus points if you can identify the problem with each example before we explain it. The more points you have at the end, the more fun you are at parties!

    Note: Due to technical limitations (and to delicious irony) some characters in this post may not display properly depending on your browser and platform. Suggestions on how to type characters are confirmed correct for UK Mac keyboards.

    01. Quote marks

    6qk56gh47qr75g9eijgdmf.jpg

    Yes, yes we are. For example, we’ll now point out that you should of course have used proper typographic quote marks above – “You’re a bunch of type nazis”.

    Because supporting “, ”, ‘ and ’ would have added complexity to typewriters, we just decided to simplify with a single symbol for single and a single symbol for double quotes that could be used everywhere, and this ‘dumb quotes’ convention stuck. (If you ever doubt how influential typewriters are even today, not only could we point you to the persistent QWERTY layout, but you’ll also see on many keyboards that the staggered grid allows for a bar to lead straight up from each key, like on a typewriter.)

    Bonus fact: you use «guillemets» (not ‘greater-than and less-than’ chevrons!) in French and Spanish, and „this style“ in German. As always, Wikipedia can out-pedant anyone on this topic.

    To type proper typographic quotes on a Mac, press alt+[, alt+shift+[, alt+] and alt+shift+]. Of course, you could let your software convert from dumb to smart quotes for you (check under 'Edit > Substitutions') but be careful, as the next mistake shows.

    02. Apostrophes

    You might think that allowing your computer to make your dumb quotes smart absolves you of all responsibility, but the problem is that computers can sometimes be a bit too smart for their own good. One of the common mistakes computers make is to use an opening single quote where an apostrophe (or closing single quote; there’s really no difference) should be used. 

    If you’re talking about the ’80s (with a closing quote mark), say, many computers would be tempted to write ‘80s (with an opening quote mark) instead, because it thinks you’re starting to write a sentence ‘in quote marks’. To fix this, make sure you type ⌥⇧] manually. The opposite can be true too these days; start a sentence with a double-digit number and some systems will convert a single dumb quote to ’, even if you then end the sentence with another quote, such as in ’10 years ago’. Here, manually typing ⌥] is necessary.

    ‘Smart’ computer systems can land you in other trouble too. For example, once you’ve got your eye in, you might often see something like this online: “The point size for body copy wouldn’t normally be bigger than 11.5″. The problem there is that a smart CMS has decided that because that quotation ends with a number, it should convert the double dumb quote you typed into a double prime (″) rather than the closing quote marks (”), since it’s assumed you meant inches. What’s a double prime, you ask? We’re glad you did.

    03. Double prime

    You might be congratulating yourself because you knew that dumb quotes were wrong for enclosing quotations, and that the correct use of the straight ' and " is to denote feet and inches. Your smugness is misplaced, sadly. In fact, those glyphs really, typographically speaking, serve no purpose. Feet and inches should be represented by ‘primes’ – a single for feet, a double for inches. So 6' 6" is wrong, but 6′ 6″ is correct.  Of course, not all fonts have primes characters, but all that means is that you should be using better fonts!

    It’s easy to type primes if you’re running OS X 10.9 or later; just tap the spacebar while holding ctrl and cmd and a character palette will pop up. You don’t have to know where to look; start typing ‘primes’ and the characters will appear. On earlier systems, choose Special Characters from the Edit menu, and in apps such as InDesign, browse the Glyphs palette.

    04. Fractions

    Ah, so you got the primes right that time, but what the hell is with those fractions? Properly, fractions should be individually typeset – often using LaTeX formatting – but even if that’s not technically possible most fonts have dedicated glyphs for common vulgar fractions. (‘Vulgar’ is a technical term there, not a synonym for ‘common’; keep politics out of typography. Actually, technically, mathematically, ‘vulgar’ is a synonym for ‘common’ but we’re in danger of disappearing down the wrong rabbit hole entirely.) 

    By calling up the character palette again you can search for ‘fraction’ (or specifically ‘half’, ‘quarter’, ‘third’ and so on) and so correctly – or at least more correctly than using normal numbers separated by a slash, like an animal – render ‘3½″ and 5¼″ disks’.

    05. Multiplication/by

    This is a particularly subtle one in some fonts, but there is a proper glyph for the ‘x’ that stands in for ‘by’, so the above should read ‘5120×2880 pixels’ rather than ‘5120x2880 pixels’. The particular Unicode character we’re using there is the multiplication sign – and yes, you could argue we’re co-opting it here – so be sure to search for that in the character palette rather than ‘x’. 

    Searching for ‘x’ shows up many different variants, including multiple mathematical, algebraic ‘x’ symbols, but not the multiplication symbol you actually want.

    Next page: 5 more typographic mistakes we all make

    06. Interpunct

    8c73e556a250d865a809638aca586cc2.jpg

    Well, there’s no arguing with the sentiment there (and the price is correct at least at the time of writing), but there is a typographical faux pas in that sentence. We’ve lost the battle on this one, we know, but properly the decimal point shouldn’t be a full stop or period, but should be an interpunct, thus: £29·99. 

    This is only true in Britain – although possibly some other countries too, especially those that were British colonies in 1971 when decimalisation struck – but technically you were only supposed to use a full stop when technical limitations meant an interpunct was unavailable.

    Happily, these days, should you wish to render prices correctly (as surely any good Brit would wish to do), you can easily get an interpunct by typing alt+shift+9.

    07. Degrees

    ec3d6a8070e76c91e2a6aca769638d60.jpg

    And it’s literally freezing in the UK as we write this, but the thing we’re specifically complaining about here is that degrees symbol, because it isn’t a degrees symbol at all. Now pay attention, 007: 24º is wrong, 24° is right. That first character is an ordinal indicator for masculine (the feminine variant is ª), and you can read about their use on Wikipedia.

    In some fonts, it’s actually really obvious that it’s not a degrees symbol because the O will have an underline, but that’s not common and it’s easy to see that someone, mashing a keyboard till they find a degrees symbol, would think they’ve found it; you get it by typing alt+0, which makes some kind of sense.

    In fact, the degree symbol’s shortcut is actually somewhat logical too. To get a bullet (that’s this character: •) on a Mac, you type alt+8, and to get a degrees symbol, it’s alt+shift+8. Conceptually, then, you can think of it a little like a ‘superscript bullet’.

    08. Hyphens and dashes

    Now, this is tricky, and depends very much on style, but the official line is that hyphens specifically should only be used in words like ‘anal-retentive’ and ‘super-annoying’ or for splitting words across lines in hyphenation; you shouldn’t even use them for a minus symbol, as there’s a specific, slightly longer Unicode character for that: −. (We’re not making this up, we promise.)

    But while hyphens in the sentence above are definitely wrong, there is no definitely right. Convention would have it that in the UK you’d use en-dashes – like this – while in the US—where everything is bigger—the longer em-dashes are favoured. Note too that in the first example, there are spaces either side of the dashes, but not in the second; that’s deliberate.

    In fact, thanks to the fractal nature of pedantry, you can also say that this is still wrong, since if you’re being super-correct there should be hairline spaces around the em-dashes. Or possibly thin spaces, which are technically thicker. But let’s not split hairs.

    You type an en-dash with alt+- and em-dashes with alt+shift+-.

    (Bonus: you should sometimes use an en-dash where you might think a hyphen is called for, when you’re dealing with attributive compounds.)

    09. Asterisks and stars

    The noble asterisk – at least as noble as Astérix – while technically being a star should nevertheless not be used as a star when you’re talking about ratings; its main purpose these days is to direct you to a caveat somewhere else on the page. 

    Happily, there are filled and empty – technically, black and white – stars in the Unicode table, and they’re pretty commonly supported. Thus you could say that this post is ★☆☆☆☆, even though of course you know in your heart it’s ★★★★★.

    You can type these symbols easily by searching ‘star’ in the character pop-up, and to make them even easier to type, you can enter a range of them with shortcuts in the Text tab of the Keyboard pane in System Preferences. Thus typing [[3 autocorrects to ★★★☆☆. Best of all, these shortcuts should sync over iCloud to your iPhone and iPad, so you can use them there too.

    10. Ellipses

    Technically, there is a difference between three full stops and an ellipsis. Wrong: ... Right: …

    To type an ellipsis, it’s alt+; – but of course, you could out-typography-nerd anyone by airily claiming you manually kern three periods each time because you think the default ellipses in your chosen font are badly set.

    Does any of this matter?

    Now look, we know that by making any of these ‘mistakes’ you probably won’t impair the sense of what you’re saying, that good grammar and clarity should take precedence, and that even with the broad acceptance of Unicode there are often good reasons to ignore these old traditions.

    And honestly, this was just meant to be a ‘oh, I didn’t know that!’ post rather than an infuriating blend of a telling-off and a diktat. But maybe, just maybe, now that you’re aware of some of these established conventions, you can help honour the rich and beautiful history of typography in the next chunk of text you set.

    Related articles:

    View the full article


  3. Colour, more than any other element of a designer's work, has the greatest influence on how viewers feel. Understanding colour theory, its cultural symbolism and the relationship between colours is necessary to becoming a better artist and designer. 

    It's always better to learn the basics before striking out to develop your own colour language. We are surrounded by colour every moment of our lives and certain things become ingrained on our consciousness, so we immediately understand what the colour is supposed to make us think or feel.

    Take red, for example. If you see a red sign in a public building, or a red road sign, you instantly know that it is likely to be a warning sign. You don't need to be aware of the content of the sign or even its shape to immediately get the sense of potential danger.

    However in Eastern Asia, for example, this cultural understanding could lead to a misunderstanding. That's because the colour red in Eastern Asia is often used to signify good fortune or prosperity.

    Sparking an emotional response

    There is another side to this language of colour, and that is emotion. Studies have shown that some colours can spark a emotional response – yellow is uplifting and cheering while blue is calming, for example.

    This emotional language may have a cultural basis, but the relationships between colours are fixed. Complementary colours are the same no matter where you are in the world, and a colour triad is fixed and not influenced by cultural background.

    This means it is easy to build a colour palette for your project where the results work together (not in harmony, that is something else again!). It's up to you to judge whether the scheme works in its context.

    The basis of all colours is the three primary colours: red, yellow and blue. Mixing these together, you can make any other colour you want. However, bear in mind that to get the shade you want, you may have to alter the brightness or saturation (this is assuming that you are working digitally). 

    To understand how complementary colours work, I recommend using a colour wheel. Here are some more tips to help you really get to grips with colour...

    01. Colour can be used to subtly affect perception

    a95219ea405b1c3adc65cc937112ec78.jpg

    Film directors are often inspired by colour, and use it in a way to convey atmosphere and style

    Some film directors use colour in a very deliberate way, in order to help the viewer understand where they are in a film and to 'stamp' it with their own distinctive style. Jean-Pierre Jeunet has an instantly recognisable style and visual language that is consistent across all his films. This still, from the film Delicatessen, has a very similar look and feel to his other movies, where colour is used to convey atmosphere, even if it's not accurate. In fact, colour use is as much about perception as it is realism.

    02. Shared colour associations can create an emotional response

    e6b79a5042c885a510ce068d8cb067f1.jpg

    Perception is key to communication in your use of colour

    Moonlight isn't blue, it's just our visual perception playing tricks on us. When we look up at the moon, what we're actually seeing is the white light of the sun reflecting back at us off the moon's grey surface. There's nothing there to give the light a blue tone. So why is moonlight blue in films? Because of a shared understanding of colour and its meaning, where we accept blue as a calming moonlit night and red as fierce daylight. Perception is key to communication in your use of colour.

    03. Colour can add or remove warmth  

    34dc18ad648bd47e87a8d4094ce02542.jpg

    Temperature relates to how 'warm' or 'cool' a colour is

    Temperature relates to how 'warm' or 'cool' a colour is. Although there are actual mathematical values for this – temperature is defined in Kelvins – most people refer to the red end of the spectrum as warm and blues as cool. Saturation is a measure of how much of a colour is present. The easiest way to visualise this is to turn your TV's colour setting down to black and white. By decreasing the colour saturation, you will just be left with various shades of grey.

    04. Use colour tools to pick the right palette

    B9SkuhpHLawfZ6SSR2impC.png

    Tools such as Adobe CC can help you speed up your understanding of colour

    Although there is no replacement for learning and observing, there are tools that can help you speed up your understanding of colour and give you a helping hand along the way. These can be traditional, such as colour wheels (there are many to choose from and explore for different reasons) or handy apps, like Adobe Color CC , which is part of the Creative Cloud.

    05. Experiment with Adobe Color

    E3RR3ZJMgfhY7WwTX2foKW.png

    Find a complementary colour palette has never been easier

    I'm after a new colour palette so setting my mode in Adobe Color to Complementary. You can see that the blues are opposite the oranges on the colour wheel, which is a great start. 

    All that needs doing now is to change the saturation using the arrow markers, and then tweak the results. You can see my approximation in the screengrab above. It really is that easy, and a great way to set a unified colour palette in your work.

    Book your Vertex 2018 ticket now

    On 13 March we’re launching Vertex 2018: a one-day event in London for the CG community. Featuring a jam-packed schedule of inspiring talks from the industry’s most exciting practitioners, there will also be workshops, networking opportunities, a busy expo and lots more. Get your ticket to Vertex 2018 now

    This article originally appeared in 3D World magazine; subscribe here

    Related articles:

    View the full article


  4. If you're part of the CG community, you can’t afford to miss out on Vertex – our one-day event celebrating all things CG. Launching on Tuesday 13 March, the schedule is bursting with inspiring talks from industry leaders, pro techniques, innovative new tech and expert advice. 

    And now you can find out exactly what’s on in our special show guide.

    Inside, you’ll find a schedule – so you know exactly what’s happening and when; opinion columns from Vertex keynote speakers Chris Nichols and Scott Ross; a guide on how to get your dream job in CG; and much more.

    Get your Vertex 2018 ticket now

    There’s still time to get tickets to Vertex 2018, if you're quick. You can get an Access All Areas pass to mingle with the experts – or see the latest in tech in our Expo hall for free: either way, just head to the Vertex website to book now.

    Come and join us at Vertex, our debut event bringing the CG community together!

    Related articles:

    View the full article


  5. With web fonts natively supported in almost all browsers, and more and more typographic features being implemented in the latest versions of HTML and CSS, a bright new era of increasingly sophisticated web typography is upon us. This means web designers need to get (re)acquainted with the rules of classic typesetting – but it doesn’t end there.

    Whereas print typography is static, web typography is a fluid medium. More than simply learning how to achieve a specific look, designers have to tackle responsive typography, and be able to predict the end result across different browsers and devices. Here are some of the basic dos and don’ts of typography, specifically applied to the web.

    01. Find out what your fonts can do

    oy2bqZQupzAHprXJmgncaQ.jpg

    Check your font has all the characters and features you need

    The very first thing you must do is check the capabilities of the fonts you are going to use. All fonts are created equal, but some fonts are more equal than the others. Unicode encoding means fonts can hold literally tens of thousands of glyphs, and the OpenType font format supports numerous features like small caps, old style numerals, discretionary ligatures and contextual alternates.

    Yet any font is only as good as the type designer who built it. What use are all those typographic niceties if the designer neglected to draw the necessary characters or failed to code the relevant features? Creating professional fonts takes an enormous amount of time and effort, and some designers are not prepared to go all the way.

    This is why it is very important to check the character set and the features of a font before incorporating it in your web design. A font is like a toolbox; if a crucial tool is missing, you won't get far – if there is a screwdriver, a saw and pliers but no hammer, not a lot of hammering will get done.

    02. Subset cleverly

    Font fallbacks happen on a character by character basis. As soon as character is missing in the specified font, the fallback system will use the corresponding character from the next font in the list, then switch back to the original font. 

    This technique can be used in an unconventional way with surprising results. If, for example, the character set of a font has no old style figures, find a corresponding font that has them. Subset it, leaving only the desired numerals, and put it first in the fallback list. All numerals in the text will then be set in that old style figure subset, and the rest of the text in the regular font. This prevents you from having to format numerals separately and keeps your text file clear of unnecessary HTML tags.

    03. Figure out numerals

    Most professional quality fonts have several sets of numerals, each with a specific use. For example:

    • Tabular: Each character occupies the same amount of space, so they will line up in vertical columns
    • Proportional: Character widths vary according to their design
    • Old style: Figures mimic the lowercase characters with an x-height, ascenders and descenders; blend perfectly with mixed-case text
    • Lining: Meant to be used in numerical matter or in combination with all-caps text

    04. Don’t fake styles

    web typography: FF Ernestine by Nina Stoessinger

    Typeface: FF Ernestine by Nina Stoessinger

    CSS enables you to fake a number of things. If there is no bold variant of your font the <b> tag will artificially embolden the text by rendering it double with a slight lateral translation. Applying the <i> tag to a font without an italic style will digitally slant the characters. The resulting distorted letters invariably look dismal. Generally speaking, you want to define all your text formatting in the CSS file, and avoid local character formatting as much as possible.

    05. ... but when you do, fake well

    Faking small caps when they are missing in the character set always makes them look too thin by comparison with the surrounding text. When the type family has a semi-bold variant, or the difference between the regular and bold weight is moderate, use that bolder weight for the small caps to adjust the darkness of the text. Don’t forget to give the small caps a little extra character space.

    06. Be careful with copy-pasting text

    You can sometimes find words in web pages with illegible character strings where there should have been an accented or other special character. This occurs when text is copied from text editing software using a character encoding other than UTF-8. Character encoding systems map all glyphs in a given character set to facilitate the transmission of data (generally numbers or text) through telecommunication networks or for data storage.

    As HTML works with UTF-8 it will misinterpret copy-pasted text from any other encoding system, turning specific characters into bizarre combinations of random letters and signs. Furthermore certain content management systems will not only copy the text but also the formatting, causing unpredictable results. The best way to avoid this is to convert the copied text to text-only format in a simple text editor, then copy it from there and paste it into the CMS.

    07. Learn your HTML entities

    web typography: FF Spinoza by Max Phillips

    Typeface: FF Spinoza by Max Phillips

    Looking at your keyboard, you may not realise what a wealth of characters is available. Many of them are defined by HTML entities, so it is a good idea to memorise the most common ones and have an overview handy when typesetting for the web. 

    A lowercase x is not the same as a multiplication sign, the trademark sign is not simply a raised capital T and M, and a floating acute accent will not do for an apostrophe. For more detail on this, take a look at our article on typographic mistakes everyone makes

    08. Define relationships, not absolute dimensions

    A big advantage of text on the web is that it can be resized by the user. If text is defined in pixels, resizing a web page may cause discrepancies in the relative sizes of the different text styles and, for example, body text may end up bigger than the headlines. It is crucial for all text sizes to be defined in ems in relation to the standard body text size. This ensures that all text in a web page is resized accordingly, respecting the relationships between the different text sizes.

    09. Take control over line breaks

    web typography: FF Spinoza by Max Phillips

    Typeface: FF Spinoza by Max Phillips

    Resizing the browser window makes text columns go narrower or wider, and end-users can also alter text sizes. This could make you believe that you have no control over line breaks. Yet when you look beyond the desired end result and understand what exactly you want to achieve there are certain aspects that can be steered.

    Line breaks occur at the end of paragraphs that are wrapped with a <p> or <div> tag. In all other cases, line breaks are very seldom inserted solely for the purpose of having the next word start at the beginning of the next line, so use the <br> tag sparingly. The most common reason is to keep two or more words together.

    10. Space with care

    The non-breaking space is not the only special space character available in HTML. An em space is as wide as the type size, creating a perfectly square separator. The en space is half its width. Very useful in tabular material is the figure space, which takes up as much room as the numerals in the font, while the punctuation space is as wide as the dot or comma. Thin spaces can be used between the dot and the next letter in abbreviated names, and hair spaces to detach em dashes from the neighbouring characters. And then there’s the three-per-em space, the four-per-em space, the six-per-em space …

    Reading is as much about the space within and between letters as it is about the black of the letters themselves. The correct hierarchy is that the space between letters is smaller than the space between words, and the space between words is smaller than the space between lines of text. Avoid adding space between letters as this causes words to break up and hinders legibility. Judiciously increasing letter spacing is only warranted for text in very small sizes. On the contrary text in display sizes often benefits from tighter tracking, but here as well don’t overdo it.

    Full justification has an adverse effect on the appearance of text. The process of justifying the words to fit the line length increases the spacing between words, making those word spaces vary wildly between subsequent text lines. This gives the text an uneven appearance and creates unsightly gaps between words in some lines. Justified left/ragged right is the preferred alignment for ease of reading.

    Besides character spacing and word spacing, line spacing also influences legibility. Lines of text that are too close to each other create a dense text image that is hard to decipher. If on the contrary the line spacing is too generous the reader has difficulties finding the correct next line after a line break.

    Related articles:

    View the full article


  6. Self-promotion is one of the trickiest and most elusive skills a designer must acquire. Like learning to ride a bicycle, you have to do it to find out how it's done.

    Nor is it something that can be avoided. As soon as designers emerge from education they have to be able to promote themselves to prospective employers.

    Later, as they enter the freelance world or the world of studio ownership, they have to be able to promote their services to prospective clients. None of this is easy, and for many designers, it's as painful as falling off a bicycle.

    It's hardly surprising that self-promotion is problematical. Design schools don't teach it, and few established designers talk about it in public. To make matters worse, we're surrounded by thousands of other designers all frantically self-promoting.

    b3c34f25d6198b6cadad884a880af8e7.jpg

    Adrian Shaughnessy illustrated by Zaneta Antosik

    For many of us, promoting ourselves feels like shouting into a wind tunnel. The whole process of self-promotion is made even more difficult by the realisation that clients mostly choose designers based on reputation and word of mouth. Yet there's no need for pessimism.

    Done properly, it's possible to self-promote in ways that get results. Most of the rules of self-promotion apply equally to finding employment and to finding clients.

    But in truth, there is really only one rule of self-promotion: if your work is good, you can ignore all the rules; good work is the best and only reliable form of self-promotion. While you are working on that, here are five rules for self-promotion...

    01. It's not all about the work

    The best self-promotion is often not about your work, it's about the other stuff you do. Back when I ran my studio, we mostly designed record covers. After doing this for a few years, we published a book on contemporary record cover art. It featured some of our own work, but it mostly contained the work of other designers.

    It wasn't done as self-promotion, it was done from a love of the subject, but the result was recognition on a scale we hadn't experienced when we merely shouted about our work.

    Now, not everyone can publish a book on their chosen subject (although you might be surprised how easy it is to get published if you've got a good idea), but everyone can find ways of adding to the body of knowledge that surrounds their discipline.

    As well as telling the world that you've just finished a new brand identity, write a blog post about an issue that interests you. Offer to write for the design press. Start debates. Promote design, not yourself.

    02. Face-to-face is best

    With the internet, and social media in particular, it's possible to 'speak' to almost anyone. Fancy working for that cool fashion label? Simple, send them a message on Facebook or Twitter. But unless you have something earth-shattering to show them, you will most likely be ignored.

    The aim of all self-promotion should be to get face-to-face meetings. If you make meeting people the main focus of your self-promotional activities, the results will be far superior to impersonal online communication. In other words, don't ask for work, ask for a meeting.

    03. Be different

    Most self-promotion looks and reads like everyone else's self-promotion. You only have to look at the majority of designer's websites.

    Firstly, many of them 'sound' and look depressingly familiar: the same stock phrases and the same neat piles of business cards and letterheads. But more worryingly, they look as if they are aimed at other designers.

    It seems we worry more about what other designers think about our work, rather than what clients might actually want. Run a health check on your website. Is it something a client might respond to, or is it aimed at friends and peers?

    04. Clients prefer results to artifacts

    It's depressing but nonetheless true that most clients care more about the impact of a piece of work has than the finely crafted details of typography, layout and production.

    This is not an argument in favour of abandoning high standards of thinking and execution; rather it is a reminder that outcomes, impact and results are what clients really care about. Make sure when you show work, you also describe its impact.

    05. A good reputation speak volumes

    The cultivation of a good reputation is the most important aspect of self-promotion. The winning lottery ticket in self-promotion is when clients, or employers, call you.

    Trish Finegan, managing director of leading design studio Spin, has a theory that a client has to see – and be impressed by – three pieces of work before they will consider you.

    What this means is that unless your work is seen in the right places and talked about in the right places, you are not going to get that "can-I-come-and-talk-to-you" call.

    So growing a reputation is vital. This means talking to journalists; speaking at conferences; getting your work on blogs; and using all of the dozens of other channels that are open to modern designers.

    Liked this? Try these…

    View the full article


  7. Don't miss Vertex 2018, our debut event for the CG community. Packed with inspiring talks from industry pros working in games, VFX and more, plus career advice, workshops, an expo and more, if you work – or play – in CG, it’s unmissable. Book your ticket now.

    Vector Displacement Mesh (VDM) is a 3D sculpt, used as brush building blocks, that enables undercutting when drawing on a model’s surface. But what exactly does it mean? 

    The simplest way to understand it is to start with alphas. Alpha textures are greyscale images that we often use for sculpting fine-detailed patterns like wrinkles and skin pores. Without them we would have to painstakingly draw the details on by hand, one by one. Alphas are awesome and quite efficient to use in combination with bushes, but they are basically flat images with black values, and they do not support undercuts and overhangs, which limits what can be done with them. 

    However, Alpha 3D stores the information of all XYZ axes and does not have any vertical elevation restrictions. By definition, it is 3D as it uses VDM in its system. All you need to worry about is the polygon density to enable proper projection of the Vector Displacement Mesh onto your model. 

    Create detailed 3D shapes with ease

    Let’s look at an example of creating some highly detailed 3D art: imagine I want to model some dragon scales, but I don't want to use a 2D alpha because this way I would have to go back and sculpt them some more for extra depth. Scales do not just sit there side by side, they overhang and partially cover one another, so it takes a great deal of time making them look realistic. It is a long, tiring and very repetitive process, but there is a way to make it easier and quicker in the future. 

    I can create a Vector Displacement Mesh, save it as a brush and simply draw my sculpt onto a model with a single stroke, as many times as my heart desires. Job done! I know that I still have to spend some time making those VDM brushes, of course, but once they are done, I will not have to go and create them again – they will be sitting in my brush library, waiting for the next time I need them. 

    Here I will demonstrate how easy it is in these simple steps, making a swirl frosting for my 10-minute 3D cupcake.  

    01. Start the swirl

    4QF2cTWW9yAVnqjAkvZAAJ.jpg

    With a clay brush selected, build a little hill in the middle of the canvas

    To start off, we first need to get a canvas, so head to Lightbox> Project>MISC and select the Brush 3D template. With a clay brush selected, build a little hill in the middle of the canvas, more or less to the size of the swirl. Now, with the radial symmetry on and DamStandard brush selected, start sculpting the grooves and peaks of the swirl shape. 

    02. Fix distorted edges

    MEq9xRcNxxuJ8S9ZiaBeQ6.jpg

    Make sure to stay away from the edges of the plane

    Make sure to stay away from the edges of the plane. If you accidentally mess up the edges, you have to fix them before saving the VDM: mask the edges, invert mask, go to Tool>Deformation>Relax Plane Grid or Morph to Grid, depending on the level of damage caused to your plane. This should reshape the edges and add more geometry.

    03. Save out to the VDM

    3FvyAyyjgavnfdsfjfCdgF.jpg

    To save as a VDM, select a brush that can save all the information contained in your model

    To save out your sculpt as a VDM, you need to select a brush that can save all the information contained in your model. With Chisel3D selected, open the Brush palette, select Create and click on Create MultiAlpha Brush. This automatically creates a new Chisel brush out of your model. Your current Alpha texture now contains a VDM of the sculpt with a 3D mark in top-left corner. 

    04. Save out the brush

    pZgv3pdMmKqiMh8FZWZdtQ.jpg

    Last thing to do is create an icon for your brush and save it

    In order to now save out the brush and create an icon for it, open a 3D sphere and turn it into a polymesh. Divide it a few times and drag out your VDM. Position the sphere to capture the icon, go to the Brush palette, hold down the Alt key and click on SelectIcon. With the icon generated, you can finally save it out with Brush>Save As. Rename your brand-new brush and it is done! 

    This article was originally published in issue 230 of 3D World, the world's best-selling magazine for CG artists. Buy issue 230 or subscribe to 3D World here.

    Book your Vertex 2018 ticket now

    On 13 March we’re launching Vertex 2018: a one-day event in London for the CG community. Featuring a jam-packed schedule of inspiring talks from the industry’s most exciting practitioners, there will also be workshops, networking opportunities, a busy expo and lots more. Get your ticket to Vertex 2018 now

    Related articles:

    View the full article


  8. In a world where users have high expectations of their experience on the web and mobile, prototyping and user evaluation is key. It's now common to progressively iterate on prototypes with increasingly high fidelity, and a flourishing user experience industry has grown up around this critical set of activities. Ultimately, getting software right at the prototyping stage saves you time and/or money later on.

    There are many approaches you can take to prototyping, and numerous tools out there to assist. One of the newest on the block is Origami Studio, developed by Facebook and available free for macOS. 

    Origami Studio, which actually started its life as a plugin for Quartz Composer (a visual programming language within macOS's Xcode development environment) before becoming a standalone tool, has gained a great deal of attention over the last year. 

    This is not only because it is built by a big-name developer, but also because of the combination of power and simplicity it brings to developing high-fidelity, interactive prototypes.

    Follow these steps to discover just how easily you can use Origami Studio to build a prototype.

    01. A new prototype

    CR7oU4fqa4VnZ6n7EB4LdY.jpg

    Start by creating a new iPhone 8 prototype

    We're going to create a prototype for a mobile app which will allow us to swipe through pictures of cats and 'like' some of them. Once we've installed Origami Studio, we'll create a new iPhone 8 prototype from the splash screen.

    02. Adding layers

    We can start to add some layers to our prototype straight away. In this case, we'll add a logo positioned at the top of the screen. We add the layer using the + button in the top right and selecting 'Image Layer'. We can then resize and position it appropriately by highlighting and modifying the layer's properties. After our brand, we'll also add a heart image at the bottom of the screen to serve as our 'like' button.

    03. Creating an interaction

    XjxatK3KyZ8xMxDnMMukgY.jpg

    For interactions you'll need to create a patch

    We need to make our heart button respond to user interactions. You'll notice that in the preview window, the cursor changes to represent touch on a mobile device. To respond to this, we need to create a 'Patch', which is essentially a function in Origami that takes inputs and produces outputs. Double-click the empty grey area to bring up a list of new patches, and search for 'interaction'. Place your patch and it should appear on the screen.

    04. Linking interactions to layers

    47CNZhtyKhLaNNMzmT2vcY.jpg

    Change the patch properties so that it only responds when you click in the right place

    At the moment, your patch will respond to touch anywhere on the prototype. Test it out by clicking and you'll see the 'Down' and 'Tap' properties changing in real time. If you select the 'Layer' property in the patch, you can link it to the layer containing the heart image, and it will now only respond to clicks on that specific area.

    05. Animations

    VCEkqMdvXdhqb39VCHA4dY.jpg

    A pop animation will give users a bit of visual feedback

    Now we want to have something happen when our interaction triggers. Create another patch, this time a 'Pop Animation'. This is used to create a springy effect. Leave the properties as they are for now, but we'll create a link between the Tap output of the Interaction we created previously and the Number input of our new Pop Animation. We do this by clicking and dragging between the small circles next to each. If you click the heart now, you'll now see the interaction triggers a change in the 'Progress' output of the Pop Animation.

    06. Transitions

    6QQXMvcrgEJ4DL7LHXm5dY.jpg

    You can change the extent to which objects change size when they're clicked

    The next thing we need is a Transition patch. This will allow us to specify low and high values to move between as the Pop Animation's Progress output changes. We can then link the Transition's output values to the Scale property of the heart image layer to tell Origami to resize it when it's clicked. You should now find that clicking the heart causes it to animate a brief change in size. It's not quite right, however, since it pops back to normal straight away.

    07. Switches

    ySKTBmJt7S5n56Xembr3dY.jpg

    Use switch patches to toggle objects between different states

    Switch patches are Origami's way of toggling between two states. This is what we want for our 'Like' button. An input passed to a Switch patch can flip it between 'on' and 'off' states, which can then be passed as an output to subsequent patches. Let's create a new Switch and place it between the Interaction and the Pop Animation. You should then be able to click the heart to toggle it between small and large states.

    08. More complex behaviour

    2qHiFB58XDfdVwU4K8zXgY.jpg

    By experimenting with patches you can add more complex behaviour to your prototype

    Congratulations! You've now created your first interactive feature, using the most common patches that you'll find you use time and time again. We can add more patches to create more complex behaviour. Let's create a different coloured heart layer directly behind our current one, then add new patches both to scale it simultaneously, and modify the opacity of our original layer so it's made visible. Now, when you tap the heart, it will toggle larger and smaller, but also appear to change colour.

    09. Carousel

    nVrRR5uPcDxxSBrV8gzPgY.jpg

    It's time to bring on all the cats

    To finish our prototype, let's add an image carousel with the cats we want to allow users to 'Like'. To do this, we first need to add a group of layers. Each image will be a separate layer, with increasingly offset x co-ordinates so that they essentially sit side-by-size in a row with only one visible on screen at any one item.

    10. Swiping left and right

    KdosSKoniZcgUMG4R33ogY.jpg

    Follow these steps to add a classic swiping action to your carousel

    The last thing we need to do to make it work is enable left and right swipes to scroll the carousel. We do this by creating a Scroll interaction to link to the carousel layer group (not the individual images). The interaction outputs an x co-ordinate which we can then link to the x property of the carousel to move it. In-between, we'll add a Clip patch, which can be used to limit values to ensure we do not scroll to co-ordinates outside the edge of the carousel.

    11. Next steps

    AUTgwMkevr7yu5XtZVdNgY.jpg

    Now you've learned the basics you can add more advanced features

    That's it. You've created a very basic app. You can also use Origami Studio's built in 'frames' to place it onto a device background, which can help give a professional finish. Now that you're familiar with the basics of using patches, you can begin to create more advanced behaviours. There are plenty of guides on the Origami Studio website, which explain how to implement popular functionalities commonly seen in apps.

    This article was originally published in issue 270 of creative web design magazine Web Designer. Buy issue 270 here or subscribe to Web Designer here.

    Related articles:

    View the full article


  9. People who know how to get things done are the people who are tapped to lead important projects. If you want to be the one who knows how to get the most out of others, you need to grab the eduCBA Project Management Lifetime Subscription Bundle. You can get it on sale now for just $29 (approx. £21).

    To prove your skills as a project manager and to make sure you’re learning all the skills you need for this career, dive into the 100 in-depth courses inside the eduCBA Project Management Lifetime Subscription Bundle. It will provide you with over 400 hours of knowledge about project management. This bundle is built to prepare you to manage your way to success regardless of your field, and will make sure you’re ready to prove your skills with certifications.

    The eduCBA Project Management Lifetime Subscription Bundle is valued at $797 but you can save a whopping 96 per cent off the retail price right now. That means you pay just $29 (approx. £21) – that's an incredible amount of savings for a bundle that will help get you into the career you want, so grab it today.

    About Creative Bloq deals

    This great deal comes courtesy of the Creative Bloq Deals store – a creative marketplace that's dedicated to ensuring you save money on the items that improve your design life.

    We all like a special offer or two, particularly with creative tools and design assets often being eye-wateringly expensive. That's why the Creative Bloq Deals store is committed to bringing you useful deals, freebies and giveaways on design assets (logos, templates, icons, fonts, vectors and more), tutorials, e-learning, inspirational items, hardware and more.

    Every day of the working week we feature a new offer, freebie or contest – if you miss one, you can easily find past deals posts on the Deals Staff author page or Offer tag page. Plus, you can get in touch with any feedback at: deals@creativebloq.com.

    Related articles:

    View the full article


  10. A great logo design, as any visual identity specialist will tell you, is only a small part of the branding package. Yet to the rest of us – those outside the veiled, mystical industry of brand consultancy – logos are what we latch onto. 

    We subliminally take meaning from these marks. We care, too. Often the public responds loudly and fiercely to the introduction of a new logo.

    And why not? Michael Wolff, co-founder of branding agency Wolff Olins, has argued that a brand belongs to its customers. They define it, because they're the ones who buy its products or use its services. It isn't surprising, then, that logos are discussed far beyond the presentation rooms of global branding agencies in Manhattan or Shoreditch.

    Even if you only have a passing interest in graphic design, it’s fascinating to see what the BP logo looked like in 1930, or debate how the Coca-Cola identity has evolved (or not) over the past 125 years. If that’s your thing, then you’re going to love our listing of the 10 best logos ever...

    10. I love New York

    c46gcQg4VTiB37wBvRxWGA.jpg

    In 1977, Milton Glaser designed the I Love New York logo in the back of a taxi, for a fee of zero

    The I Love New York logo seems ubiquitous and eternal today, but it was designed by Milton Glaser in 1977 for the New York State Department of Commerce in a moment of inspiration during a taxi ride through his beloved city. So universal is the design that ‘to heart’ has now become a verb, colloquially speaking. 

    Here, the legendary designer discusses his love for his home city, as well as his body of work and the role technology plays in his design practice...

    How important is New York City to your work?  

    "I’ve often thought about it and I can’t imagine a life, for me, outside of the city. I would have found another way of being in the world and doing work, I’m sure. All I know is the nature of this city: its complexity; its diversity; that it offers so many opportunities for learning; and the fact that it’s so contradictory. New York is not the most beautiful of cities. It changes all the time. It’s not a city that imposes its vision on people who come in; they impose their vision here." 

    "Everything is open, everything is up for grabs, everything is to be questioned. That aspect of not accepting anything as being ultimate or the final truth seems to me a source of great vitality, energy and options for people. Anything can happen here. And that, of course, creates a very different environment than a culture where very little can happen."

    Is there enough understanding of the past these days?

    "Well, the [design] field itself is dominated by fashion and by the idea of selling stuff, so you have to be concerned with what’s currently being done, and the economy is based on the idea of change and new styles, and this year’s whatever. Unfortunately, that’s not the real basis for serious work."

    "If you’re more serious about it, you have to be more concerned about durability and ideas that go beyond the moment, so I think the best designers around are always designers that have had a kind of broader look and don’t change with the prevailing wind. If you find that all you’re doing is copying what is already being done, you’ll have no position in the field. You’ll have nothing to offer and, after 20 years of doing it, you’re nowhere."  

    What is your relationship to digital technology?  

    "I have an ‘arm’s length’ relationship to it, but I’m also mad about what you can do with a computer. I love working with other people on the computer, sort of like dancing. It’s a way of working collaboratively that’s never been done before."

    "But you have to come to it with an existing sense of form. If you don’t have form and an understanding of visual phenomena, and don’t understand how to draw, from my point of view, it’s a very mischievous instrument because it forces you into patterns that it imposes."

    Next page: IBM

    09. IBM

    The roadmap for IBM’s modern design ethos was set out in the 1950s with the hiring of design consultant Eliot Noyes, who’d worked at the Museum of Modern Art in New York. He brought influences like Charles and Ray Eames, Eero Saarinen and Isamu Noguchi to bear on the company’s industrial design, and hired Paul Rand to create the IBM visual identity in 1956. This move was repeated with the refresh in 1972.

    Discover the evolution of the IBM logo below:

    Next page: London Underground

    08. London Underground

    djZpnUfDnWeBTngnyQty6P.jpg

    This 1919 logo design became the basis for the modern logo

    Though it's hard to imagine a simpler logo than the white type against a blue bar, all run across a red thick-stroked circle, the London Underground logo is one of the world's most recognisable. Branding buses, stations and subways in England's capital, it has become an imperishable symbol of the city that created it – and has been more than a hundred years in development.

    Here we take you through the changing face of the London Underground logo:

    Enduring Appeal

    In his recent book, A Logo for London, David Lawrence traces the history of London's most enduring sign, attempting to pin down the logo's enduring appeal. "The logo is sufficiently abstract and yet so widely reproduced that it represents many things for many people – city, transportation, culture, place, a unified system, cool design. It's this that makes it a flexible, enduring brand," he says. It's never been out of fashion, he adds, "because at worst it tirelessly sits in the background telling us where to catch a bus or train."

    Next page: The Red Cross

    07. The Red Cross

    The red cross emblem is an incredibly economical symbol, but one that delivers its meaning – of neutrality and protection – in the most effective ways.

    Fbzdqi4poT3hcfFxqKg8LM.jpg

    The red cross emblem, 1864

    It's a simple mark, but one that conveys its message immediately. With no exact specification of red, and the only guidelines instructing that the cross should always have arms of equal length and be shown on a white background, the red cross emblem is easily displayed in places where materials to create perfect design might not be available. 

    YH5rHvxyHxqGaWK67LRPCb.jpg

    The red crescent, first used by the Ottoman Empire in 1876

    The red cross, and indeed the red crescent (first used by soldiers from the Ottoman Empire in 1876 because the red cross reminded them of the crusaders of the Middle Ages) is a sign of neutrality and protection in armed conflict . Its use is restricted by international and national laws.

    Ti7R5LMH3fjr9y3VQaKgYT.jpg

    Both emblems have the same meaning and status, and have no political or religious significance. The restriction of usage is important here: the red cross emblem must be trusted to signify this neutrality and protection, and therefore unauthorised use is forbidden in international and rational law. 

    Next page: Target

    06. Target

    uBNYbH2kD4fJdaT2NAB7UJ.jpg

    Stewart K. Widdess, 1962

    One of the most recognisable brands in US retail, Target now has more than 1,800 stores in the US alone. Its mark was visualised at the conception of the brand name itself and symbolises the company's aim to achieve the perfect in-store customer experience. 

    tzy9emX2qePPwabNpAG6dN.jpg

    The original Target logo

    In the months before the first Target store opened its doors, director of publicity Stewart K Widdess was tasked to name and brand the new retail store. Legend has it that Widdess and his staff debated more than 200 possible names. 

    In a moment of inspiration, both the name Target and the now-familiar bullseye (although in a slightly different form) were conceived. The reasoning? Just as a marksman's goal is to hit the centre bullseye, the new store would do much the same in terms of retail goods, services, commitment to the community, price, value and overall experience. 

    QEFCpmWcYFcp5v4AEMKYhS.jpg

    One of the first advertisements – from 1969 – to bear the new, simplified Target logo

    The current version of the logo was designed in 1968, removing a number of the inside rings to simplify the design, and making it a more direct and recognisable symbol for the company.

    Next page: Apple

    05. Apple

    syVgw5CU839KN4zK2Ps3zA.jpg

    Rob Janoff, Regis McKenna, 1977

    Apple's initial logo was a drawing of Isaac Newton by Ron Wayne in 1976. Steve Jobs knew it would never work as a brand and commissioned a new mark the following year. Since then, the apple's shape has remained the same, aside from some geometric tweaks for the 1998 refresh, and the move from coloured stripes to a solid silhouette. Rob Janoff's logo has remained an important element in Apple's global success story since its inception. 

    In pictures – how the Apple logo developed:

    We spoke to graphic designer Rob Janoff, the man handed the job of designing a logo for a company called Apple Computer...

    What was your original brief and what did Apple want the logo to convey?

    "I didn't have much of a brief, when I think about it. It was a few words from Steve Jobs, which were, 'Don't make it cute.' I think he was referring mostly to the typography." 

    "Don't make it cute"

    Steve Jobs

    How did you come up with the idea of an apple with a bite taken out of it?

    "When you take a bite out of an apple, it stays sort of bite-shaped, it doesn't collapse as a peach would. It was to make it look more like an apple, and to give it scale – because people's mouths are a certain size and an apple is a certain size, and the bite would be a size relater."

    How many versions did you present?

    "I've never done this before or ever again, but I was just so sure about this design that there was just one version. However we did have a back pocket one, which was the apple without the bite in it, in case they thought it was a bit too cute. That never got shown." 

    Next page: Woolmark

    04. Woolmark

    One of the world's most recognisable logos doesn't belong to a commercial brand at all – but who designed it?

    DSPKSucZAcqLxswc5LvC6E.jpg

    1963

    Formed from five black bands that crisscross to form a traditional skein of wool, the Woolmark logo is soft, elegant and organic. It's perfectly suited for its purpose: representing the use of pure wool in a product. The logo is officially credited to Francesco Saroglia, as the winner of a design competition. Nothing further is known about Saroglia, however, and it's believed that Italian designer Franco Grignani was responsible for the logo. 

    A mark of quality

    Simplicity is often the key quality of a perfect logo. So what could be more representative of a mark that's meant to signify a garment is made of pure wool than an elegantly drawn skein of wool? The logo is elegant and instantly recognisable without being overly detailed. 

    "People associate it with the product they see on it: wool"

    Rob Langtry, Woolmark

    TETTBBDjqZNp2K9u6RYQsc.jpg

    The Woolmark is used on a variety of eligible garments of all types

    Because it's instantly recognisable, the mark also speaks of the qualities of wool. "In an age where we've moved far too quickly to synthetic fibres and disposability, there's something reassuring and positive about a mark that represents a natural, renewable resource," enthuses Rob Langtry, global chief strategy and marketing officer at Woolmark.

    CV9mCueFe6hGcBD9yaTUNe.jpg

    "The brush strokes allow a finesse that sometimes gets lost in the world of digital origination" Rob Langtry

    Next page: Nike

    03. Nike

    5M85ZY6XcNmDrLLW6esBF4.jpg

    Carolyn Davidson designed this logo in 1971 for a fee of only $35

    Ticking all the boxes for $35

    The Nike emblem is one of the world's most recognisable, and it's often the simplest ideas that are the best – as proved by this mark created by Portland student Carolyn Davidson in 1971. Paid $35 for the logo at the time, she later, in 1983, received a gold swoosh ring embedded with a diamond and an envelope containing Nike stock from founder Phillip Knight. It's perhaps one of the most interesting – and most widely reported – stories in logo design history. 

    wRgmyzdzJeVVbJKwHsw6U9.jpg

    Nike swoosh sketches by Carolyn Davidson and US Patent papers

    Victory

    Davidson's tick-like logo was seen as a symbol of positivity, but it's actually the outline of the wing of the goddess Nike (who personified victory). Her logo was subsequently registered as a trademark and, aside from some tinkering with the Nike lettering, has remained unchanged.

    XY698mMduLsADmMaAqDRLV.jpg

    A Nike archive shoot from the 70s of a running shoe bearing the famous swoosh

    Chasing Originality

    According to Nike's website, upon first seeing Davidson's design, Knight said: "I don't love it, but it will grow on me." In 2011, Davidson told OregonLive.com that it was a challenge to come up with a logo that conveyed motion and that Phillip Knight was very impressed with the stripes of rival company Adidas, so it was increasingly hard to come up with something original. 

    Next page: Shell

    02. Shell

    dpSyq8xNpuAGJLstvn36zk.jpg

    Raymond Loewy, 1971

    It was French-born designer, Raymond Loewy who drew the first modern Shell logo. He simplified the logo to make it more recognisable and bold at a distance – essential when your logo is primarily placed on the side of a road with traffic going past at speed. He gave the lettering and red border of the shell itself greater impact.

    View the below gallery to see the changing faces of Shell's iconic logo:

    Next page: FedEx

    01. FedEx

    URfixdz4M4fCw6L8C6kVvP.jpg

    This logo introduced a name change as well as a new look

    Replacing the original Federal Express logo, which was designed in 1974, the new logo introduced a name change and a cleaner, simpler look and feel. Purple was retained as a brand colour with orange added, and the FedEx logo thrives on its use of white space. It was applied to 600 aircraft, and 30,000 ground vehicles.

    With that sneaky little arrow nestling between the E and the X, the FedEx logo perfectly embodies what the company does – moving letters, boxes and freight from A to B. It has won over 40 design awards, and even though it was unveiled in 1994 it's still a favourite. 

    We spoke to Lindon Leader, who was senior design director at Landor Associates when it was designed... 

    9r8UhvCtfmFsRaxkztwpVQ.jpg

    Lindon Leader

    It's over 20 years since the FedEx logo was designed. What do you remember best about the project?

    "I've always said it takes a great client to make a great project. Frederick Smith, the CEO, allowed us to do our job, and simply said to me, 'Lindon, if you feel that our trucks need to be pink and green, just give me a good reason.' In other words, he was trusting us."

    "If you feel that our trucks need to be pink and green, just give me a good reason"

    Frederick Smith, FedEx CEO

    What were the key things the client wanted the identity to communicate?

    "The primary attributes of the FedEx brand are precision, service, speed, reliability. They're the kind of attributes that you just don't develop overnight – no pun intended, given their original tagline." 

    ysiUJcmw3FqMVo7JdmEj2Y.jpg

    The old Federal Express logo

    How did you approach it?

    "We conducted a nine-month global research study that revealed that customers were generally unaware of Federal Express' global scope and full service capabilities." 

    "Customers had come to say 'FedEx a package' even when they were using other shippers. So the process of express shipping had become generic. We advised them that the company needed to leverage its most valuable asset, and that is the FedEx brand." 

    "On an international scale, 'federal' had some negative connotations in certain parts of the world – Federalists in Latin America; Federal Republic of Germany. That was among the reasons why moving to the name FedEx was going to be so much more communicative for them."

    jf2DUazEXsN6xdSrGbLnRH.jpg

    Three of the five final designs presented to the FedEx board

    What were the other potential logos like?

    "Each of the five candidates did pretty much what the current identity is doing. They maximised the impact of the identity, whilst also maximising the colour white. It's on their envelopes, it's on their vehicles, it's on their aircraft because white is traditionally associated with Federal Express."

    Tell us about the use of white, and your process of subtraction?

    "I cannot tell you how many times I fight with a client who says, 'I'm paying an enormous amount of money to pay for an ad in a magazine and you're telling me you want 60 per cent of it to be empty space?' On the one hand I can understand where they're coming from. But basically the average client does not have a sophisticated enough appreciation of white space to understand that it can be a strategic marketing tool." 

    N3NQEGMgPDfVJgHL7AmzHc.jpg

    Shipping packaging created after the redesign

    For you, what is it that makes a logo last, and when do you think a company should change its logo?

    "From a historical perspective, back in the 50s, 60s and 70s, a company would come to a design agency and look to, more often than not, refresh an identity that had been around for quite a while. In those days what a client hoped to accomplish was to get 20 years out of a logo before it needed to be refreshed or changed."

    "If you take Silicon Valley start-ups out of the equation, these days companies are looking to refresh down to as little as five, maybe 10 years, if you're lucky."

    Related articles:

    View the full article


  11. In recent years, a whole string of rebrands for major companies have made the internet fizz with discussion. DesignStudio's work for Airbnb and Premier League, for example, got legions of fans frothing at the mouth with both glee and rage. 

    More recently, North's new identity for London's Science Museum and W+K's rebrand of Formula 1 were the talk of the design industry – in the latter case, for litigious reasons as well as aesthetic ones.

    But we're not here to talk about those today. Small businesses are the bread and butter of the design industry, but they often fly under the radar of the design press – with some notable exceptions. Read on to discover five small-scale rebrands that received a disproportionate amount of attention, and what you can learn from them.

    01. The Butcher The Baker

    Three black and white posters on a wall under spotlights

    This brand scheme from The Partners' is based on a popular nursery rhyme

    Relatively small-scale rebrands that are pitched at niche markets, or highly location-specific, are unlikely to garner widespread attention unless they're covered by the design press, or fare well at the major design awards.

    Unless you were based in Dundee, Scotland, or prepared to travel a few hundred miles for a string of sausages and a freshly baked loaf, you wouldn't think a merger between a third-generation artisan baker and a local family owned butcher would be big news.

    Step up The Partners (now Superunion). The fact that a butcher and a baker were involved was almost too good to be true. The children's rhyme Rub-a-dub-dub provided the perfect creative copywriting opportunity, with the third line ("The butcher, the baker, the candlestick maker") playfully conveying relevant brand messages.

    The logo resembles a candlestick but, on closer inspection, is constructed from inverted silhouettes of a butcher and a baker. The branding is beautifully clever and stylishly simple, and picked up gongs from D&AD, the Brand Impact Awards and more – showing how, with the right investment in smart design, a tiny artisan producer can punch above its weight.

    02. Hidden Characters

    svGED8KFyKoDiNuq9pzVwB.jpg

    Re: gave PR a more thoughtful face in this project

    Public relations has had its reputation tarnished over recent years. In the era of incessant media spin and 'fake news', the gloss and glitz have definitely dulled somewhat. Consumers increasingly want authenticity and substance, and brands have had to respond accordingly.

    For its rebrand of Bang PR, Australian studio Re: repositioned the agency's offering as a more thoughtful, strategic beast – a far cry from the champagne-quaffing, red-carpet-rolling hedonism of old-school PR. In short, the rebrand put the focus on the clients' needs, not the PR firm itself.

    Hidden Characters was the perfect name to express how the firm works behind the scenes to offer value. Using the unseen typographic symbols in programmes such as Word and InDesign as a graphic device, Re: built a simple but effective branding system, using print finishes and folding techniques to play with the viability of different aspects.

    All in all, it's a great example of branding that practices what it preaches, putting a smart, thoughtful twist on a sector not renowned for its subtlety. Like The Butcher The Baker, Hidden Characters was noticed at the design awards – picking up a Graphite Pencil at D&AD, amongst others.

    03. Boxes In Boxes

    nJ98yqNas4fnGutaZWaQxB.jpg

    its wit and simplicity helped this garner attention for this Studio Sutherl& project

    Showing off a series of different sized cardboard boxes may not seem like a dream design brief at first glance, but Studio Sutherl& founder Jim Sutherland has a knack for finding joy and playfulness in the most unlikely places.

    Like The Partners with The Butcher The Baker, Sutherland found the perfect source of inspiration in a children's nursery rhyme for this project for London-based printing and packaging firm Boss Box, using lines from 'There was an old lady who swallowed a fly' to express the idea of progressively smaller objects fitting inside each other.

    Like the previous two examples, wit and simplicity is crucial for the impact of this project. The concept is conveyed entirely through different weight, size and playful placements of type, which also highlights the format and construction of each box.

    Another D&AD success – this time with a Yellow Pencil – Boxes In Boxes reinforces the importance of a strong idea for turning even the most potentially mundane brief into a major talking point.

    04. Mr Cooper

    dMwKH5Y9eVDJQtyW5BpkvB.jpg

    Johnson Banks' Mr Cooper identity was was all over the design press even while the product was still being tested

    Johnson Banks is well known for its smart, high-profile branding programmes for clients in the cultural, not-for-profit and education sectors in particular. Its work for Cystic Fibrosis, Unicef UK and the University of Cambridge cleaned up over three successive years at Computer Arts' Brand Impact Awards.

    The world-class consultancy is perhaps less known for working with artisan startups. But its cheeky, stylish and colourful brand identity for Mr Cooper – an 'adult' ice-cream brand specialising in alcoholic and gourmet flavours – was splashed across the design press, even while the product was still in its testing phase.

    Johnson Banks expressed the hedonistic nature of Mr Cooper's product through a beautiful hand-lettered mark, produced in collaboration with copywriter Rob Clarke. The mark utilises positive and negative space to spell out the brand name within the shape of a pair of lips. The logo can be rubber-stamped directly onto cups and napkins, as if a cheeky kiss had recently been planted there.

    Designers love a clever application of negative space, as well as a playful, versatile brand mark – and the design press lapped it up like it was ice cream.

    05. Penstripe

    i4tVKGzMCTtzcWB9EjdPyB.jpg

    Taxi Studio's Penstripe rebrand is based around visual metaphors for creativity

    Taxi Studio's rebrand of Leeds Booklet Printing Company shows that a twist of creative genius can turn a middleman service business into an 'event' brand in its own right. Taxi ditched the perfunctory name and replaced it with the more stylish, location-agnostic Penstripe – all part of a strikingly creative, highly versatile brand identity that blends traditional typography with a contemporary pinstripe pattern.

    At its heart is a series of line drawings of visual metaphors that sum up creativity, efficiency and innovation. There's a rabbit being pulled from a hat, with a tagline about quick, clever solutions to challenges; a lightbulb filament inside a head, communicating bright ideas and market-leading solutions; an alarm clock being slotted into a piggy bank, with a tagline about saving precious time.

    Penstripe went on to win multiple awards. And like the other examples on this list, it goes to show that if you treat every design brief with the same level of rigour and creative expression – regardless of the size of the client – it can pay off in the long run.

    Related articles:

    View the full article


  12. It's that time of the month: the new issue of Computer Arts magazine is on sale now. This issue puts the spotlight on careers, with a special report that aims to help you upgrade yourself. It offers advice for identifying where your skills gaps are and shows you how to pinpoint what employers are looking for, to help you get a step closer to your dream job, no matter what that might be.

    Buy Computer Arts issue 277 now 

    In the Projects section, the team goes behind the scenes on groundbreaking new design work. This issue, there's a closer look at Baxter and Bailey's colourful rebrand for the OUP's Education division, and Wieden + Kennedy NY's irreverent interpretation of online dating for OkCupid. Plus, the team visited Here Design to find out how it brings together thinkers, writers and makers to create design magic. 

    cQgYQuiNNNo6znXwFcZDGL.jpg

    Find out how Wieden+Kennedy NY put a sweet spin on online dating for OkCupid

    Each month, the Computer Arts team gets top designers' views on the topics on everyone's minds. In issue #277, CBA Paris' Anne Henry offers her thoughts on how larger brands can connect with the new wave of more socially conscious consumers, and The Other Box founder Roshni Goyate explains why the diversity problem in the design industry doesn't have a quick fix. 

    Finally, the community critiques Pentagram's new identity for Mills & Boon – is it hot stuff or a little limp? For a sneak peek inside the issue, use the arrow icons to flick through the image below.

    Save up to 63% on a Computer Arts subscription

    Computer Arts is the world's best-selling design magazine, packed full of insights, inspiration, interviews and all the best new design projects. For all this delivered direct to your door each month, subscribe to Computer Arts. Right now you can save up to 63%!

    Read more:

    View the full article


  13. For filmmaker Guillermo del Toro (Pan’s Labyrinth), fairy tales are a way to address social issues as universal themes, and the cross-species romance. The Shape of Water explores the idea that love can be found in various forms against a backdrop of paranoia and bigotry.

    The pivotal concern for the $19 million dollar production was to have audience members believe that an amphibian creature – captured from the Amazon and taken to a secret American government facility – could have an affair with a mute cleaning lady.

    01. Creating a believable creature

    To create a captivating and unconventional leading man, del Toro relied on the practical expertise of Legacy Effects co-owners Shane Mahan and Lindsay Macgowan, the design talents of sculptor Mike Hill, the digital knowledge of production VFX supervisor and Mr. X CEO Dennis Berardi, and the performance of acclaimed actor Doug Jones.

    Design work had already begun on the amphibian man. “We met Guillermo, David Grasso and David Meng at Bleak House,” explains Legacy Effects co-owner Lindsay Macgowan.

    “Our job was to take the best elements of the maquette that the two Davids had done and create a new one. Normally the consideration of having a human inside isn’t necessarily the top priority at that point in concepting character. However, we already knew that Doug Jones was going to be the creature so we had a scan of him.”

    Fish person maquette

    Left: A Legacy Effects maquette. Middle/ right: A clay maquette that makes use of a really square jaw, cleft chin and high cheek bones

    Utilising ZBrush, Legacy Effects sculptor Glen Hanz digitally pieced together a new version of the amphibian man. “It was a fully painted maquette on an electric turntable. We had a little UV light that you could show character; however, we already knew that Doug Jones was going to be the creature so we had a scan of him.” 

    Utilising ZBrush, Legacy Effects sculptor Glen Hanz digitally pieced together a new version of the amphibian man. “It was a fully painted maquette on an electric turntable. We had a little UV light that you could show the bioluminescence coming on and off as the character turned around. Also, with the regular light you would see the translucency through the fins.”

    Making the creature attractive

    Assisting Hanz on sculpting the body was Mario Torres, while Guillermo del Toro brought in friend and sculptor Mike Hill to redesign the facial features. “My main concern was that the lady has a relationship with this creature so he had to be somewhat attractive,” remarks Hill.

    “Guillermo wanted a lot of things in there like Jean Marais’ handsomeness in Jean Cocteau’s Beauty and the Beast and Jack Kirby-esque lines. There were a lot of references to combine in one face.“ 

    “I went over to Guillermo’s house for a couple of days and from 8am to midnight I would sculpt the head. Guillermo would come in and out and make suggestions. By the end of that 40-hour period we had nailed the look.”

    Fish person jaw sculpt

    The face plate was made out of foam rubber at the request of Guillermo del Toro

    Initially the plan was to have a mechanical head for the amphibian man. “Guillermo would say, ‘It’s got to emote, kiss a girl and be able to smile,’” remarks Mahan. 

    “That’s when the alarm bells went off in our heads: ‘We can’t do this mechanically because it’s not like the face is only going to do two or three moves throughout the entire movie. Let’s go with a make-up approach and bring the face right down to Doug Jones’.“ 

    “We did a clay press over the head of Glen Hanz’s maquette and that gave us the proportions, as a lot of the shapes were already balanced to Doug’s. Early on in our development phase I tried to envision Doug in the make-up chair at 3am,” reveals Mahan when describing the amphibian man transformation process that would take three hours to complete each day.

    Huge transformation

    “The suit has a backpack that’s hidden so to enable Doug to forcibly crawl inside. The feet are attached which is uncommon. We wanted the line of his calf and Achilles heel to be that of a swimmer’s body. Anytime you break something you will produce a line inadvertently. Doug had to sit in the suit while we did the make-up. A fibreglass skullcap went on that had a silicone magnetic goggle system to attach the eyes to. It also attached his mechanical gills to his neck.“

    "From there the facial make-up that Mike had sculpted got put on. There was a silicone back of the head. Guillermo wanted the face to be foam rubber. There’s a thin tight hood that just went up and over the skullcap. We would glue the hood to the skullcap. Then you could put the headpiece on, so Doug was really encased in this thing. If Doug had to go to the bathroom we would have to unglue his glove so that his hand could be free.”

    A last-minute overhaul was made to the colour pallet of the creature suit. “We did a film test which resulted in Dan Laustsen [cinematographer], and Guillermo determining that it was too pale,” remarks Mahan. “The suit went to Mike Hill’s shop for a painting overdo.” The patterning remained the same but the seven coats of underpainting were altered.

    Fish person painted torso

    The layers of underpainting look different under various lighting conditions

    “The original colour was a stone grey but we changed it to a yellow ochre on the chest and had iridescent black and blue velvet on the back,” states Hill. “We also broke up the high points on the biceps and buttocks. Guillermo gave me a reference of a salamander that he liked.”

    The colour alteration led to only one of the four suits being ready for the first week of filming. “It was nerve-wracking to get Doug out at night and ring that suit out,” admits Mahan. “It had about 60 pounds of water in it and had to be dry for the morning. I would peel off the damaged areas and Mike would touch up the paint because foam rubber paint and water are not friendly to each other. And you can imagine Guillermo’s highly tuned sense of attention to detail on a suit that has been cooked for a day. It was a challenge.”

    Expressing emotion

    In order for the amphibian man to express a vast variety of emotions, digital augmentation was required and provided by production VFX supervisor Dennis Berardi and Mr. X, the visual effects company based in Toronto where he serves as the CEO. “Guillermo was all about micro gestures,” notes Berardi.

    “He wanted to see the controls the animators were using [in Maya] for the facial rig to create the performances. Guillermo wanted to make sure that we had enough latitude before we even started. That’s really getting under the hood. We had to do a whole presentation for Guillermo where we showed him the range of our motion on the eyebrows, upper and lower lips and cheek, as well as the blinking of the eyes and creases in the forehead area. Once we had the toolset we became in sync with what Guillermo was asking for, because he knew our tools and what we could do.”

    Artists repairing the fish person costume

    Left to right: Mike Hill, Sean Sansom, Shane Mahan and Jay Detheridge doing an on-set fix

    Doug Jones was scanned multiple times with and without make-up to produce a digital double of the amphibian man. “Guillermo would direct the animators as if he was directing an actor on set and we would do take after take,” states Berardi. “Then we would render our CG face or head over the photographic one. We would carefully use aspects of the real head and our render and seam it all in painstakingly. This was not a pipeline show. Every shot was crafted. There was no automatic process.” 

    Glowing blue stripes accent the creature suit. “That was the subdermal bioluminescence and it was all digital. We match moved our digital asset of the amphibian man over the live-action footage to make an exact match and did this bioluminescence flickering and glowing effect, which we took inspiration from cuttlefish and deep-sea creatures that have internal illumination. It couldn’t look electric or synthetic. It had to look like organic phenomena.”

    Iron lung

    Elisa Esposito (Sally Hawkins) meets the object of her affection for the first time when he is wheeled into the laboratory encased in an iron lung. “We scanned everything on the show so I had a digital double of that empty iron lung,” states Berardi.

    “We carefully match moved the camera and iron lung in Maya. Then I had the scene recreated in 3D. Once Guillermo approved the animation, which was a swimming motion and the hand slamming into the glass, we put our digital asset into fully high-resolution volumetric water that we created in Houdini.”

    The colour of the water was green not blue. “Guillermo wanted to imply that the amphibian man can’t live in regular water. Therefore, we had that green organic water with the organic mass and debris that he needs to survive; that complicated the water simulation a lot because all of that stuff needed to move and swirl around and be displaced by the swimming motion of the amphibian man.”

    Eliza looking into an iron lung

    A hand is added digitally reaching out to hit the glass. green water allows for the use of organic particles that swirl around, creating the impression of movement

    A lot of shots involve Elisa Esposito having digital wet hair. “The grooming was a long process,” reveals Berardi. “We did tons of photo surveys of Sally Hawkins. We shot extreme close-ups of her and worked with the hair and make-up people to understand the texture of the hair. We groomed the hair to match and ran a Houdini hair simulation algorithm that we developed here. Guillermo doesn’t like things to be random. We choreographed the hair movements carefully. Guillermo wanted the audience to be reminded of beautiful reeds under the water.”

    The Shape of Water led to a system upgrade for Mr. X. “The animation controls and rigging that we had to develop was a new level of detail and complexity. Working with Guillermo just as a performance-based director in the facial performance was something that was also new for us. We had to be ready for that.

    "For the effects simulations, especially on the water, we had to add a lot of rendering horsepower. In fact, we tripled our rendering farm to help complete this show. In the end I think we had over 15,000 cores to render this show working 24/7. Then the actual rendering of the amphibian man with the subsurface scattering, something that Guillermo cared about a lot, was a new area for us in terms of look development.

    “The biggest challenge for us was realising Guillermo’s vision of a fairy tale where love conquers evil, but where the visuals are so integrated and don’t break the suspension of disbelief,” observes Berardi. “lt was a high bar with Guillermo directing and Dan Laustsen as the cinematographer. The footage was beautiful so we had to be pixel perfect and completely integrated.”

    A major attraction for being part of the production for Legacy Effects was the presence of Guillermo del Toro. “What helped make this such a great project to work on was his passion, but also the type of work that we were doing was infectious,” notes Macgowan. “You can’t help but want to do the best work you can with him.”

    02. Creating the opening scene

    The opening scene in The Shape of Water was the hardest shot of the movie for Dennis Berardi and his team at Mr. X, which takes place in a riverbed and moves into a submerged apartment with the floating sleeping figure of Elisa Esposito (Sally Hawkins). “It’s a two-and-a-half minute shot,” explains Berardi.

    “We shot some reference in Georgian Bay and Guillermo del Toro liked the feel of it, but wanted to choreograph the timing of the swimming fish and the movement of the underwater lake grasses so it was like a dance. It is all digitally created. Then we transition into a real apartment set which we shot using a dry-for-wet technique.

    "We filled the set with smoke and had projectors above the set to project caustic light beams. We pinned Sally Hawkins’ hair down because it was going to be CG. Anything that is floating was digitally animated.

    “Our big challenge there was doing the photoreal riverbed environment and transitioning seamlessly into a real set, while maintaining the illusion of still being underwater,” notes Berardi.

    “We matched the lighting closely and equalised the two by adding a volume of floating particulate [like a current] that continued through from the beginning right to the end. That unified it. The fish unified it. All of the floating elements unified it. We carefully tried to match the look of that apartment in terms of tonal feel. It certainly wasn’t easy. We added some escaping bubbles from underwater crevasses as well.”

    It is a proud moment. “You see a perfect hybrid in play where we go from a digital environment into a real one, and I hope that the audience just sees a beautiful shot.”

    03. Building a cinematic environment

    The escape plan devised by Elisa Esposito revolves around a canal which is seen as the means of returning the amphibian man to his aquatic home. Some digital wizardry was needed to transform the Toronto setting into the desired cinematic environment.

    “We did have to get rid of the CN Tower but that was the easiest part of that shot,” reveals Dennis Berardi. “The most difficult part of that shot was creating the illusion that the water level of the canal is rising as the rains come. Elisa’s plan is to release the creature as the water level gets up to a certain level, so that he can get out of the canal and into the open water. We did shoot that harbour side at a location. That water is digital and all Houdini based.”

    Reflecting into the digital water is the sky, which adds to the believability. “We would do full HDRI photo surveys on set and a 360-degree dome of the sky at ten stops of latitude; that gave us the lighting design,” explains Berardi. “We would re-reflect the sky that was captured on the days of our photo surveys into our digital water. In terms of the other objects in the scene, they were recreated so that we could reflect them in our synthetic water.”

    04. Shooting stylish water

    Elisa watching rain run down a window

    The shot of Elisa that commences the water droplet dance brought to life by CGI

    As Elisa travels on a bus and looks through the windows, water droplets gracefully perform to her finger motions on the glass.

    “That was hard and fun to do,” states Dennis Berardi. “Guillermo del Toro wanted to foreshadow the dance routine between the creature and Elisa that happens later in the movie. It’s supposed to be a ballet in the water droplets.”

    A plate was shot of Sally Hawkins moving her fingers against the bus window. “We had talked about pushing in on Elisa and then into a more macro world. We played with zooming into a macro world and got it wrong a lot of times. It felt synthetic. We had to be subtle with the transition from 1:1 scale. We’re looking through a bus window that is three feet across down to a scale that is only half an inch across.

    "We designed a bunch of style frames to show Guillermo where we were going and he signed off on it in principle. In the end, we took 15 seconds to get into that fully macro world so it’s a slow transition hidden in many frames."

    05. Flooding a bathroom

    An intimate moment occurs when Elisa Esposito floods her bathroom to create a makeshift water tank so that she can make love to the amphibian man.

    “That was great,” states Berardi. “We sunk the bathroom set in a water tank for their embracing underwater love scene. I also shot a green screen element where we built a green screen stand-in door, had a thousand gallons of water in a water tank, did a quick release, and the water would open and flood through the doors.”

    The shots of the water filling up are digital. “The aftermath when Giles [Richard Jenkins] pulls the door open and the water escapes and splashes out, that’s a digital shot as well,” remarks Berardi. “It was challenging because we had to create this believable illusion that this volume of water is escaping out of a bathroom door. Guillermo wanted it to dissipate quite quickly. He also wanted it to be elegant, not violent. Guillermo wanted it to be fun.

    "In our early simulations we were running these physically correct volumes of water through that door and the water rushed violently. We had to tone it down and come up with a graceful take before Guillermo started to like and believe in it. I did dozens and dozens of experimental internal takes before I would show Guillermo anything. Once I did he would start to revise us."

    While all of this is taking place water leaks into the movie theatre situated beneath the apartment in which Elisa lives. “That was easier. I’m always surprised that people pick it out. It may be a testament to the sound design as well because we only put five or six streams of water droplets in there. The rest was sound. We didn’t have to do that much to create that illusion.”

    This article was originally published in issue 231 of 3D World, the world's best-selling magazine for CG artists. Buy issue 231 here or subscribe to 3D World here.

    Related articles:

    View the full article


  14. You're reading WP Maintenance Mode Updated with Chatbot Functionality, originally posted on Designmodo. If you've enjoyed this post, be sure to follow on Twitter, Facebook, Google+!

    WP Maintenance Mode featured

    WP Maintenance Mode is a free and open source “maintenance mode” plugin that packs a lot of features in an easy to use interface. Unlike the basic maintenance functionality available in WordPress, WP Maintenance Mode adds custom text, design options, a countdown option and more. The plugin can also be used as a coming soon […]


    img.php?z=1260473&k=7c274c44627d36b4e9e9

    KZEp9-x_mVE

    View the full article


  15. Getting into ecommerce is simpler than ever. There are plenty of great places to sell  your work online, but if you have some basic tech skills, you can create a unique, personalised experience by adding retail functionality to your own website. There are a number of different services to help you do this. Here, we take a look at the most popular ecommerce solutions, and explore the benefits and drawbacks of each.

    01. Shopify

    8D3zst2vxETrhKpFXnYMPV.jpg

    Shopify is every easy to use, and offers plenty of helpful features

    • Price: From $29/mo

    Shopify is one of the biggest and the most well known ecommerce solutions available to the general public. At time of writing, there were three different packages available: the basic one starting at $29 per month, ranging to $299 a month for more advanced ecommerce features. Shopify charges a 2.2 per cent fee, plus an extra 20p for each online sales.

    Pros
    If you're looking for simple setup, quick sales and a way to easily expand your business online, Shopify is a great choice. Its packages take care of much of the boring, tedious stuff associated with selling things online, offering services such as 24/7 support, free SSL certificates and fraud analysis. 

    Cons
    As a blogging or online store platform, Shopify struggles to compete with the likes of WordPress, with its content management ease and SEO features. As a developer, the limited support for custom code or scripts can be frustrating. What's more, most of Shopify's features are locked in, which means switching to another platform can be tricky.

    02. WooCommerce

    wE7UpEabpbKiS45q2n9jvV.jpg

    WooCommerce is a free WordPress plugin

    • Price: Free

    WooCommerce is one of the most popular free WordPress plugins available. It essentially enables you to turn your WordPress website or blog into an online store by adding ecommerce functionality, enabling you to process digital and physical orders through the power of WooCommerce.

    Pros
    In ecommerce, it's key to separate yourself from your competitors. WooCommerce provides plenty of customisation features, including themes and more plugins to change the styling of your shop, expand accessibility, and more. It also improves security when processing transactions, taking all the worry away from you as an owner, and your customers. 

    Another great feature of WooCommerce is its vast range of analytics tools. These are great 
for engaging with customer purchases and activity and crunching stats, making the whole process of analysing your retail activity simple.

    Cons
    While WooCommerce itself is free, once you've purchased various supplementary themes and plugins it can become very expensive very quickly. You can customise your shop on your own if you have the skills, but otherwise you’ll need to buy a pre-made theme. 

    03. BigCommerce

    Gpb7VbgrJY739gpsWqmu5c.jpg

    BigCommerce offers full CMS features

    • Price: From $29.95/mo

    BigCommerce is a paid hosting service for online shops processing physical or virtual transactions, and it boasts clients such as Toyota, Kodak and Martha Stewart. This service is aimed at users with web design skills, and offers customers the ability to personally customise their sites (there's also a theme store, where users can buy and sell themes for BigCommerce shops).

    The platform offers users the opportunity to list their products on Amazon, eBay, Facebook and more. There's a range of subscription options, providing solutions for independent businesses with small, frequent transactions right up to mass sales for high-volume businesses. 

    Pros
    BigCommerce offers full CMS features, enabling you to change content easily, provide discounts and coupon codes to customers, and optimise your site for search engines. For savvy users, there’s even the ability to tweak the CSS and HTML.

    Cons
    BigCommerce places limits on your annual sales – at the standard package you’re limited to a $50,000 processing fee per annum. If you choose Braintree for payments you may encounter a 2.9 per cent fee on each credit card transactions from PayPal, too.

    04. Volusion

    67nwCmuXDF9ziRkMpBCKJX.jpg

    Volusion's bandwidth caps are a major drawback

    • Price: Free

    Like all other good ecommerce platforms, Volusion aims to help you focus more on the selling and less on the tedious tasks surrounding it. The most basic package costs $15 per month and offers support for 100 products, a secure checkout, online support and 1GB of bandwidth (more on this later).

    Pros
    Volusion provides you with the tools to quickly design and deploy a website, including a simple editor and theme picker. It offers 11 free themes and 38 premium themes starting at $180. Unlike to other ecommerce platforms here, Volusion doesn't charge any transaction fees, so you get to keep all your profits. Your monthly package also includes 24/7 customer support, which is handy if you're just starting out with ecommerce.

    Cons
    Subscriptions include a strict bandwidth limit on your site. If you have large images or content, they’re going to eat up your 1GB of monthly bandwidth pretty quickly – and the more visitors your attract, the more bandwidth you’re going to need. You’ll soon have to buy more bandwidth to keep your store up and running, especially during peak times. 

    What's more Volusion doesn’t offer free SSL certificates or any blogging functions, something deemed quite critical for marketing and providing a secure transaction environment.

    This article was originally published in creative web design magazine Web Designer. Buy issue 270 or subscribe.

    Read more:

    View the full article


  16. Oh boy. If the road to hell is paved with good intentions, then BrewDog has probably just built an eight-lane superhighway with its latest piece of marketing. With International Women's Day just around the corner, the cult Glasgow brewery has waded in with a well-meaning campaign aimed at ending gender pay inequality, which manages to hit all the wrong notes.

    It's hard to fault much of its thinking. "At BrewDog," says its press release, "we have always believed that beer is for everyone, and equality is a fundamental right. So today we are launching a clarion call to end the discrimination of gender pay inequality. In the UK men earn on average 20% more than women. And that's not ok."

    Yep, with you there. But here's how BrewDog's approaching the issue: with a specially redesigned version of its Punk IPA, renamed Pink IPA. "Satirically dubbed Beer for Girls," the company says, "Pink IPA is BrewDog’s clarion call to close the gender pay gap in the UK and around the world and to expose sexist marketing to women, particularly within the beer industry."

    And yeah, you can see what BrewDog's doing, and honestly there are some great points in there. You can almost sense it tiptoeing through the equality minefield, with a promise to pay 20 per cent of the proceeds from Punk IPA and Pink IPA sold over the next four weeks to charities that fight inequality and support women. Plus a 20 per cent discount on Pink IPA in BrewDog bars for people who identify as female – a qualification guaranteed to infuriate all the right people.

    Meanwhile over at the Pink IPA site, it provides a handy clickable guide to the gender pay gap around the world, with South Korea coming off worst with a gap of 39 per cent.

    Yet for everything it gets right, it then makes a colossal, cringeworthy misstep, starting with the whole misguided Pink IPA and Beer for Girls thing, and then followed up by its red-faced insistence that it's satirising sexism with this approach. Which we're sure is its intent, but the widespread reaction on social media shows us just how infuriatingly wrong BrewDog's got this one.

    We kind of feel a bit sorry for BrewDog; it's raising some important points and trying to do the right thing. But this whole episode reads like your dad hearing about this 'feminism' thing and giving it a try. For example, from the Pink IPA site:

    "Pink IPA might look different on the outside, but it’s exactly the same on the inside.

    "Just like the female workforce."

    10/10 for good intentions, guys, but 0/10 for basic biology.

    View the full article


  17. A good night's sleep can do a body good. Unfortunately, that's easier said than done. If you're having a hard time getting to sleep at night, it's time to give Pzizz Pro a try. This best-selling app is designed to help you get to sleep, and you can get it on sale now for 80 per cent off the retail price.

    Pzizz Pro is the world's most advanced sleep system. Designed to help you fall asleep fast and stay asleep throughout the night, this app is essential for night owls who are looking to get some more rest in their life. Pzizz utilises effective psychoacoustic principles that can ease your mind and help to regulate your sleep. It's a service that is counted on by all sorts of successful people, including JK Rowling and Roy Hibbert. Now you can join them.

    You can get a lifetime subscription to Pzizz Pro for just $119.99 (approx. £87). That's a saving of 80 per cent off the retail price for a service that will finally help you get a good night's sleep every single night. Grab this deal today.

    About Creative Bloq deals

    This great deal comes courtesy of the Creative Bloq Deals store – a creative marketplace that's dedicated to ensuring you save money on the items that improve your design life.

    We all like a special offer or two, particularly with creative tools and design assets often being eye-wateringly expensive. That's why the Creative Bloq Deals store is committed to bringing you useful deals, freebies and giveaways on design assets (logos, templates, icons, fonts, vectors and more), tutorials, e-learning, inspirational items, hardware and more.

    Every day of the working week we feature a new offer, freebie or contest – if you miss one, you can easily find past deals posts on the Deals Staff author page or Offer tag page. Plus, you can get in touch with any feedback at: deals@creativebloq.com.

    Related articles:

    View the full article


  18. So you’ve learnt about all the different art techniques you can think of – composition, colour theory, anatomy, light, perspective and so on. But how do you put these together and manipulate them to create a memorable, moving image? 

    Want to know how to draw a scene with real emotion? Here are 10 helpful tips to get you started.

    01.  Utilize lighting 

    FEcR4JiTew8s4eTixkvV4f.jpg

    High-contrast lighting helps build the tension in this image by Kamil Murzyn

    Platige Image artist Kamil Murzyn says: "Lighting is a very important factor in creating any mood and directing a story. I usually select a natural lighting condition which has some general rules, such as daylight, overcast light, or sunset; I then shift them to better fit the story and feeling I want to create. 

    "For a suspense-themed illustration, it’s a natural choice to pick lighting conditions that allow for high contrasts, so I choose a simple night sky with strong moonlight. Night and gloom always create a feeling of danger and horror."

    02. Use real life

    xbpX4tQzTpoSBnGGzZuhp4.jpg

    Mammoliti thought back to times of despair to help him create the mood for this piece

    "Use your own experience when depicting emotions," says artist Damien Mammoliti. "When was the last time you experienced despair? How did it make you feel? If you could personify and create a character based on that emotion, how would it look? Asking yourself these questions can help you to create a narrative for your illustration."

    03. Introduce symbolism

    Kc3rzC759dCWX2HRuw4vRE.jpg

    The yellow snake ties the image and theme together in this painting by Maria Poliakova

    "Thinking on the theme of 'envy', I came up with the idea of a 'hot' yellow-orange snake in the girl’s hands," says freelance 2D artist Maria Poliakova. "Envy is a strong, sizzling, toxic feeling, and the warm coloured snake creates a strong contrast against the character’s cold, green skin. The yellow snake also complements the girl’s yellow eyes and scaly body."

    04. Prepare with words as well as images

    QfBABtNHiiFsYaGa9RDNNP.jpg

    Mapping out ideas like this can help ensure the concept is clear to the viewer

    "A mind map is a graphical diagram of related thoughts and words about a subject," explains concept artist Emi Chen. "It includes a branching-out of ideas from a central starting point. In this case, I wanted the illustration to revolve around the concept of 'mystery', so I created a mind map focused on this word and what comes to mind. 

    "From there, I kept exploring various themes and subjects that relate to the word. I tried to exhaust all possibilities, exploring everything that I could until I was sure there were absolutely no more related ideas left."

    05. Keep the story in mind

    eVFZNtFFLbtRTkDLwbvnSf.jpg

    Abandoned warehouse? Empty ice-cream truck? Blood smears? There is plenty to suggest a story unfolding in this image

    "Story is the overall idea or concept of the piece," says digital artist Andy Walsh. "Sometimes you make art that’s just pretty and you’ll notice it doesn’t get much attention. But throw in a little backstory or some elements that make us go deeper into the scene or character, and your audience will not just appreciate the piece but delight in it. 

    "Really think about elements that make your audience curious as to what’s going on and invite them in to explore. What’s in the box? Who’s around the corner? What story happened to get us to this scene?"  

    06. Convey sensory disruption 

    aKV46TVXg4M5hWoJ5tVFp7.jpg

    Use small details to help convey big emotion

    "Fear is a very interesting emotion to depict. using some basic ideas, we can easily evoke those emotions in the viewer," says Mammoliti. "Uncomfortable feelings like hair laying on an open eye, or water filling into the mouth, demonstrate what types of sensations can be played with in an image like this. 

    "Here, I can evoke empathy by disrupting useful sensations (such as tasting or breathing) or placing things where they are most unwanted. This helps the viewer gain empathy towards the subject matter, heightening their experience of the emotion."  

    07. Use narrative that others can associate with

    Km5DHD39sRDcHyRPQT7JZM.jpg

    This narrative helps suggests longing, using themes many people can relate to

    Illustrator Kevin Hong says: "Nostalgia is a very sentimental and wistful feeling linked with personal experiences, and although it’s a universally shared emotion, what triggers it can be very different for each person. That said, there are certain narratives that I think everyone can relate to. Moments of idling, waiting, or of childhood especially. With this in mind, I create several digital sketches to illustrate these moments." 

    08. Consider your composition carefully 

    UMciug876aftYqaGtQvKZX.jpg

    Placing the goddess high up in the composition helps convey the feeling of awe

    "I like to think about composition and the different viewpoints I can show my scene from, almost like having a movie camera in my mind and traveling around a scene trying to find the most interesting still shot to recreate," reveals illustrator Scott Murphy. "For this illustration, I consider which angle and composition will help to showcase the goddess and the surrounding crowd and set the mood accurately. Finding the right vantage point can help with the emotion or story you are trying to portray."

     09. Play with colors to find the right mood

    cLFoL4pcs7tfjuwbG8eSDf.jpg

    Search for color combinations that best reflect the feeling you are trying to convey

    "When plotting out ideas for colours, I often like to test different ideas using some typical colour combinations; complementary, analogous, and achromatic combinations being some of my favourites," Mammoliti says. 

    "Complementary means what it sounds like: opposites on the colour wheel match well together and will often create a great contrast for paintings. Analogous colours are colours that sit next to one another on the colour wheel; these types of combinations will offer balance. Achromatic is the lack of saturation on those colours you’ve chosen, which can be used to make a more emotional scene. This image will have a slightly desaturated complementary palette to help reflect the feeling of despair."

    10. Make sure you enjoy it

    8Xs8Nrm8855KXm8F5ac6E7.jpg

    A unique image that conveys something that is meaningful will always capture an audience

    "The key to making interesting work is to make art that you find interesting," says Hong. "Indulge in what you enjoy creating, and try not to sabotage that by making work that conforms to an industry or a field. If you make work that you really enjoy and work hard at perfecting your craft, then you will find clients who will commission you for being you." 

    Read more:

    View the full article


  19. At Vertex, our debut event for the CG community, you'll be able to hear from incredible experts in their field. With an Access All Areas pass, you can get the best that Vertex has to offer and listen to our keynote speeches, rub shoulders with our experts at our networking event and more. 

    But did you know that you can also learn from our experts for free in our Expo Area in the East Hall? Entrance won't cost you any money, but you have to book your free tickets beforehand as you will need them on arrival.

    rQLUGcjX9Jsp8wYjgEEW2a.jpg

    Digby Dragon is an animation by Blue Zoo.

    Here's the full schedule for the Expo hall:

    9:45am - Blue Zoo Animation - Izzy Burton, Ben Steer & Tom Box - The Making of Blue Zoo's Animated Shorts

    10:40am - Maxon - Jonas Pilz - Cinema 4D MoGraph - Motion Graphics made easy

    11:35am - Insydium -  ‘X-Particles -  Bob Walmsley - Create like never before: add Fluid, Fire and Smoke to your Cinema 4D toolkit.’

    12:30pm - iTooSoft - Paul Roberts - Creating large scale environments with Forest Pack and RailClone

    1:25pm - BREAK

    2:20pm -  Notch VR 

    3:15pm - CG Trader  -  Dalia Lasaite 

    4:10pm -  DoveTail Games - Jess Magnus, Environment Art for Games: Working in the Industry and Career Progression 

    Blue Zoo – The Making of Blue Zoo's Animated Shorts

    uGheBADcCF2b9ixwNfgSjQ.jpg

    From left to right: Tom Box, Ben Steer and Izzy Burton.

    You'll be able to hear from Blue Zoo, who will present The Making of Blue Zoo's Animated Shorts with Tom Box, co-founder; Ben Steer, animation director; and Izzy Burton, concept artist.

    Tom co-founded Blue Zoo Animation and over the studio's 17-year growth the company has become one of the leading CG animation studios in the UK, picking up a few awards along the way. Tom runs the short film programme at Blue Zoo. Ben is the writer and director behind Mamoon, the BAFTA-nominated animated short, and Izzy is the director of Via, the latest short to come out of the programme.

    Cinema 4D MoGraph – Motion Graphics Made Easy

    XdAYHJeMgPBz76sF6YMYx3.jpg

    Jonas Pilz will be presenting at Vertex.

    You'll also be able to learn from Maxon's Jonas Pilz, who will show you the powerful MoGraph tools and how quickly and easily you can create eye-catching motion graphics using Cinema 4D. 

    After graduating from university in 2011, Jonas Pilz worked as a freelance 3D generalist for a period of four years and created lots of visualisations and animations for designated industrial clients and television with Cinema 4D. In 2015 Jonas Pilz joined the MAXON family, giving Cinema 4D workshops and presenting MAXON products at trade shows and other public events.

    Whether it's abstract animations, moving fonts or breaking objects – you’ll learn how easy it is to set up any kind of graphics 3D animation in Cinema 4D. Jonas will show you that MoGraph setups are also perfect for VFX and visualisation purposes. In short, you will fall in love with Cinema 4D after this presentation.

    Discover X-Particles and Cycles 4D

    LFDxqmfrWu5S5mbyHfpyM9.jpg

    Bob Walmsley will discuss how to use the latest features of X-Particles.

    Bob Walmsley from Insydium will also be presenting in the East Hall. Bob is a motion graphics designer, 3D generalist and educator and his credits include the Victoria Derbyshire programme on BBC2 and several news features on the BBC News Channel and BBC World. Bob will be demonstrating the latest versions of their Cinema 4D plugins X-Particles and Cycles 4D.

    Using the major new features xpClothFX, xpExplosiaFX and xpFluidFX, he’ll be showing how designers can switch effortlessly between motion graphics and VFX, within a unified system built on the most intuitive particle software on the market.

    Discover how X-Particles and Cycles 4D's seamless integration into the Cinema 4D workflow allows artists to fully immerse themselves in design, rather than get slowed down in the technical process.

    Create large-scale environments with Forest Pack and RailClone

    XUCMSSaxdHXpUhr3YsMhFD.jpg

    Paul Roberts will demonstrate how to use Forest Pack and RailClone to boost visualisations.

    iTooSoft's training manager Paul Roberts will also be presenting on Forest Pack and RailClone, two of the most popular procedural modelling and scattering plugins for 3ds Max in the CG industry, capable of creating and rendering scenes with nearly limitless poly-counts.

    Paul is an experienced 3D environment artist and educator who has been working with 3ds Max for over 15 years as a 3D designer and lecturer for the games, product design and visualisation industries.

    Both Forest Pack and RailClone have endless applications besides their namesakes. In this presentation, the iToosoft team uses real case studies from LUXX Studios, Makuta, Blur, Screenscene VFX and more to go beyond their tools’ obvious uses, demonstrating tips and techniques to illustrate boundless versatility for VFX, VR, real-time and architectural visualisation.

    So don't miss out on Vertex, our CG event for the community! Get your tickets, whether for the East Hall Expo Area or for an Access All Areas pass now!

    Read more:

    View the full article


  20. To help you learn how to create a 3D alien pirate character, I will show you how I sculpted the face of my creature, Worgrock (above), and put him into a dramatic pose. ZBrush is my main weapon of choice due to its many sculpting tools, and generally being fun to sculpt with. I'll also use Maya, Substance Painter and V-Ray.

    I will share with you some techniques I use in everyday modelling and concept visual development work. For the past 13 years I’ve worked for various movie, game and commercial studios as a 3D modeller, texture painter and concept artist. I’m something of a creature specialist now, but before I went digital I worked as a traditional sculptor, painter and make-up artist.

    Collage of a gun sketch, a beetle and a dog harness

    Gathering references is a great place to start to find ideas

    To help with your character design, gather references that spark ideas. Inspiration for the alien's weapon was from my 2D concept art, inspiration for the head shape from the rhino beetle and the costume from my dog’s harness. 

    Feel free to use pre-made 3D models such as teeth, tongues or heads to quickly kitbash a creature concept together using MergeVisible and DynaMesh.

    Download the files you'll need for this tutorial – including a video walkthrough – here (865MB) 

    01. Do some major form sculpting

    dexGzvNRXCaP2xstHYjMKK.jpg

    Click the top-right arrows icon to enlarge this screenshot

    Start to sculpt your face to the point where it has all the major forms, including large forehead wrinkles, large eyebags and features that break the silhouette and catch the light.

    02. Carve in large wrinkles

    For bigger wrinkles such as the forehead wrinkles, carve in the lines with the Dam Standard brush on your mesh’s highest subdivision level, then drop down a level or two and use the Inflate brush to bulk up the folds. Switch back to the highest level and use the Pinch brush and a little Smooth to finish them off.

    03. Gather an alpha library

    n25sPvZUkjPFwU6Rmd6uzN.jpg

    Click the top-right arrows icon to enlarge this screenshot

    Now you are ready to add some finer detail such as pores, fine wrinkles, warts and stretch marks. For this we will use a combination of ZBrush alphas and hand sculpting. 

    Gnomonology, Surface Mimic and XYZ all have great alphas for sale on their websites. There are also a lot of free alphas available online, such as from the Pixologic Download Center. I suggest starting your own alpha library that you can have and take with you to each job to reuse for future projects. 

    04. Use recommended alphas

    No99LTBgrBHzfg6iYMuTaX.jpg

    Click the top-right arrows icon to enlarge this screenshot

    I’ll start with the alphas that come with ZBrush. For skin warts and breakup I like to use alpha 08, with the Standard brush and DragRect turned on. Tweak the Z Intensity and Zadd or Zsub as needed. You can also tweak Modify>Contrast in the Alpha palette. For quick pores, you can choose alpha 07 with the Spray stroke set to Spray and Zsub.

    For the dry skin on the alien’s shoulders and back I will use the Spray stroke with alpha 58 Zsub. Blur the alpha in the Alpha palette for different effects.

    You can quickly browse to alphas using the comma key to get thumbnails, or just import them into the Alpha palette directly.

    05. Make custom alphas

    xJ8btUiobLkf5P2LE4DFzL.jpg

    Click the top-right arrows icon to enlarge this screenshot

    Feel free to edit your own alphas and save them as a PSD. I found some great wrinkle details on the Hand_Male_RingFinger from Surface Mimic, so I went in and lassoed out the wrinkle sections and saved it. I made sure to keep a 50% grey border and I kept the layers in the PSD in case I wanted to go back in and edit it later. I also used wrinkles from Hand_Male_ IndexFinger – I just cropped out everything except the knuckle. These are good crosshatch patterns for wrinkle layout. 

    After you lay down the alphas, go back into some of the grooves with the Dam Standard brush.

    06. Add pores to give skin detail

    5Dp7nCutA49XC6LhDhCNyL.jpg

    Click the top-right arrows icon to enlarge this screenshot

    I have a photo of an orange-skin.jpg I downloaded online from undoz on ZBrushCentral that works great for pores. I also used skin_BaldHeadTopSkin01 and skin_BaldHeadShaved from Surface Mimic for the pores with Surface mode on in the Alpha palette as well as Rf set to 10.

    07. Refine skin textures

    HRSDkkUwrTYee8MNd7Uaed.jpg

    I had fun finding the right type of evil smile for this character. This smile was inspired by Jack Nicholson.

    After I drag out my wrinkle and pore alphas I go over areas by hand using the Inflate brush on the wrinkles and Dam Standard on the lines/crevices as a final touch. For some parts of the face I smooth the details out a slight bit, with a low smooth intensity and BrushMod set to 50 or 70 so only the small details get smoothed out, leaving the larger forms undamaged.

    08. Test render with skin material

    kuGBYWyVghrRjrdhEnhmZk.jpg

    Click the top-right arrows icon to enlarge this screenshot

    For skin I like to do test renders with the ZBrush skin shader material or the default Blinn with WaxPreview set to 30. This will give you a better idea of how the sculpt works on skin rather than just using metal or stone type material. 

    We will render with BPR in ZBrush and set up the render globals: SmoothNormals on, AO on set to 0.5, WaxPreview on, BPR Shadow Angle 95, Blur 6, Rays 64 and BPR AO Strength 0.5, Blur 4.

    09. Decimate your model

    If the image is for a still and you do not want to deal with baking out displacement, decimate your model with Keep UVs on if your model has UVs. 

    10. Do final renders in V-Ray

    6QpEU4GUMW9g3akZoQTLDm.jpg

    Click the top-right arrows icon to enlarge this screenshot

    For testing, I prefer to render in the final renderer that will be used as soon as possible. This project is a V-Ray project so I will do test renders in V-Ray – just to make sure the details pop as much as I’d like. This is when it’s nice to have details sculpted on a layer in ZBrush so you can dial the intensity of fine details up and down as needed.

    11. Perfect your posing

    Having your character in a nice pose is a must for creating an engaging image. An interesting pose will really help bring your character to life and give an insight into what they are like and how they move.

    12. Load into ZBrush

    Load your neutral-posed model into ZBrush. To make life easier I combine the costume as one mesh, combine the gun as one mesh, then I have the creature body, teeth, eyes and tongue.

    13. Get set up

    Dock the ZPlugin menu and press Transpose Master. If you want you can turn on the Grps to preserve polygrounds and Layer to make a layer per subtool. This can be useful later if you want to use the Morph brush to  x poses. 

    Hit TPoseMesh. I tend to use this instead of a ZSphere rig as I find this way is faster and you have exact control over how the mesh bends. Now you’ll notice your mesh shows up as one mesh in the Subtool menu, this is good.

    14. Hide and unhind

    Now we will use a series of hiding/unhiding geo and mashing plus the Transpose tool to pose our creature. A helpful hotkey is to hold Ctrl plus Shift and then left-click on a mesh to hide all but the parts you clicked.

    15. Use the Transpose Line tool

    Press W to bring up the Transpose Line tool in ZBrush 4R7. In ZBrush 4R8, to switch from Gizmo 3D to Transpose Line, press Y or click the circle icon. 

    16. Transpose masks

    To drag out a mask, hold Ctrl and left-click from the edge of your mesh inward to create a mask that follows the form of your object. I dragged the tool-masking buttons out into my main interface because I use them so much.

    For example you can grow the mask using the grow mask button, or sharpen, then grow, then blur. Ctrl+I inverts the mask.

    17. Test a quick pose

    I tend to do the large pose shapes first, such as a hip turn or a left step/lean, then the small ones last, such as a finger bend. I suggest doing some quick tests (parts can collide etc) and then finding a pose you like, screengrabbing it and then going back and redoing it cleanly with no penetration parts or stretching. 

    Sometimes if you really know the pose you want you can nail it on the first try without this process, but I tend to test several poses first. 

    18. Add a ground plane

    SpMjPJDA25Db4sQjGGfj6S.jpg

    Click the top-right arrows icon to enlarge this screenshot

    I recommend having a ground plane in your scene so that you can get the bottom of the foot to be flush with the floor. I find it easier to model a flat plane in Maya and extrude the outer edges out and down slightly so you see the ground plane from an orthographic view in Maya. If it’s just a flat plane it disappears in the side view.

    19. Create a sense of weight

    For the hips pose, I look through the front view and press P to turn off perspective mode. Hold Ctrl and left-click-drag a mask out over the legs, so that you can lock the legs down while you pose the upper torso and arms.

    20. Check the silhouette

    qp4akMwBQsnzRDQayRwqvR.jpg

    Painted 4K polypaint Diffuse Color and spec maps in ZBrush 

    Hold Ctrl and click the stroke lasso tool. Pick lasso mode so you can drag a lasso out instead of a box. Once you have lassoed the legs, Ctrl-shift-click the ground plane so only the ground is visible and also mask off the ground. Then Ctrl-shift-click in the viewport to reveal all the meshes. 

    You can switch to a flat colour material so that it’s easier to see what parts are masked and not.

    21. Blur feather masks

    Once the mask is good on the legs, I tend to blur this a fair bit as we need a nice falloff. Drag a transpose line down your creature from head to belly, click Rotate R and click the centre dot. You may need to have less masking on the hip area so they bend properly from the right spot. Once I have the upper body in the right spot, I’ll move onto posing the legs using the same process.

    22. Save the pose

    cqj7GFFJgtEKN9TLdPnozR.jpg

    The not-so-friendly alien space pirate from the outer rim, with a mean appetite 

    Once you have your final pose, press TPose>SubT. I recommend pressing TPose>SubT every 10 to 15 minutes and saving. Sometimes this process crashes and this way you won’t lose your work. Happy posing!

    This article was originally published in issue 230 of 3D World, the world's best-selling magazine for CG artists. Buy issue 230 here or subscribe to 3D World here.

    Related articles:

    View the full article


  21. The upcoming Star Wars spin-off, Solo: A Star Wars story, has hit a new bump in the road before its release on 28 May. Solo, which already been dogged by behind the scenes upheaval and hastily drafted acting coaches, now finds itself in a poster design plagiarism row thanks to its recently released typographic teaser posters.

    Unveiled back in February, the posters for Solo received a warm welcome thanks to their clever blend of typography and character graphics, not to mention the way they appeared to mix traditional and digital design elements.

    However, it emerged over the weekend that the Solo posters bear more than a passing resemblance to a series of Sony Music France album covers by Hachim Bahous released in 2015. With comparable colours, typography and graphics, the similarities are certainly uncanny, to say the least.

    Amazon graphic designer Adam Levermore shared the designs on Twitter to gauge the creative community's response. Judge for yourself whether the two designs are more than just a coincidence by exploring them below.

    Speaking on Facebook, Bahous said: "I am flattered that the quality of my work is recognised, but it is still pure and simple forgery, I have not been asked for my permission, I wish to be credited and paid for this work I have done for Sony!"

    Indeed, a monumental coincidence would be noteworthy enough. But the story becomes even more problematic if you consider that Disney could have gone through Sony to secure repurposing rights without either studio being obligated to get permission from Bahous – a theory that many online creatives have leaped upon.

    The whole incident has left artists and designers debating where paying homage ends and outright theft begins. And with no word forthcoming from Disney or BLT Communications, LLC, the creative team behind the posters, it remains to be seen if the dispute will be resolved.

    Related articles:

    View the full article


  22. It took a while, but VR is here – and with it a wide range of VR headsets for designers and artists to get creative with.  

    As well as the obvious utility for gaming, VR looks set to become big business in a huge range of other industries, including film-making, architecture and medicine. This presents a growing opportunity for designers and developers to get in on the ground level. 

    If you want to start exploring this new form of 3D art, you'll need to choose the right hardware. Here are some of the best VR headsets around to help you decide which one is best for you.

    abyZZN3jMy87aWHXCUepSL.jpg

    HoloLens is perfect for experiences in which the real world is mixed with the virtual

    The first untethered holographic computer, HoloLens overlays different CG elements onto the transparent screen in front of each eye to create real-looking 3D holograms. HoloLens is perfect for experiences that benefit from mixing the real world with the virtual – from seeing how a chair would look in your living room to highly empathetic social experiences, such as meeting a hero or figure from the news.  

    HoloLens can really read a room. Not only can it identify what an object is, it can tell what material it’s made from. It features 12 sensors including four environment-understanding cameras and four microphones, and includes spatial sound, gaze tracking, gesture input and voice support.

    Sounds perfect then – if you can afford it. Sadly the HoloLens doesn't come cheap. Budget for a few thousand pounds if you really want this kit.

    Read our sister site TechRadar's hands on Microsoft HoloLens review

    kNApsW9JXuNMNKnNvxZiRY.jpg

    The Vive comes with two handheld controllers, offering greater capability for navigation and gesture recognition

    The HTC Vive needs to be tethered to a powerful desktop GPU – but the result is the ability to create immersive, active VR. One huge benefit is the ability to move around space (a minimum of 2x1.5m is recommended by HTC). It works by using two sensors positioned in the corner of the room that track the whereabouts of the headset by sweeping with lasers.

    The Vive comes with two handheld controllers, meaning greater capability for menus, navigation and gesture recognition. The headset also sports a front-facing camera, giving designers the ability to build the real world into games or experiences. And if you feel like you'll need something even more powerful, then the duel OLED running HTC Vive Pro will soon be on the market, too.

    Read TechRadar's 5 star HTC Vive review

    Q8UKgKTDuXd8c5YA7EoBnS.jpg

    The Rift’s integrated VR audio system is excellent

    Much like the HTC Vive, the Oculus Rift requires a wired connection to a high-spec (and often very expensive) gaming PC, running Windows 7 or higher, but the payoff is the ability to create processing-heavy interactive experiences and games. 

    When it first launched, the Rift couldn’t do room-scale VR (so users had to sit, or stand still). But recent updates bringing in an additional low-latency constellation tracking system means users can now walk around – just be aware, not all users will have this capability. 

    The same applies to the newly launched Touch controllers, which need to be purchased separtely to add greater interactivity. The Rift’s integrated VR audio system is excellent, and is widely considered to be better than its competitor, the HTC Vive.

    Learn more in TechRadar's full Oculus Rift review

    3BqwkdJ8hUeEmFKiJ42sre.jpg

    PlayStation VR is tethered to a PS4 rather than an expensive PC gaming rig

    A more affordable option than the HTC Vive or Oculus Rift, PlayStation VR is tethered to a PS4 rather than an expensive PC gaming rig. That makes it the obvious launchpad into VR if you already own a PS4.

    The downside of this is less power – and so potentially less immersion. The PlayStation Camera tracks nine light points on the headset so room-scale VR is technically possible, but as Sony has opted for one sensor instead of two, the tracking is not as good as on the HTC Vive.

    Although, at present, PlayStation VR content is more gaming-focused, the headset’s huge sales figures makes it a serious proposition for the mass market. So if you have a PlayStation already and aren't completely sold on VR, then going for this model makes a nice affordable option by way of a convincer.

    Check out TechRadar's full Playstation VR review

    HM5ARDCSHWxRofctpyiMt.jpg

    The Gear VR is the go-to VR platform for many

    Powered by Samsung Galaxy smartphones, Samsung Gear VR effectively splits the phone screen in two to create 3D visuals, to offer affordable, wire-free virtual reality. Lacking the power of a high-spec PC, Gear VR is a natural home for 360-video (passive content) or semi-active experiences that require moving the head to hotspots, rather than hugely interactive projects.  

    Originally launched in 2013, the Gear VR is the go-to VR platform for many. It’s widely understood by the public and a large number of experiences already exist for it. This has been boosted by a partnership with Facebook, bringing the Oculus VR store to the platform.

    And an upgraded headset has improved the size of the lenses to widen the field of view, making the Gear VR’s experiences feel more immersive than the original launch model. Not bad at all for the price.

    You can see all the specs in TechRadar's full Samsung Gear VR review

    qmEELpvCnmkZTE7iPNfn2G.jpg

    Google Daydream View uses a phone to power VR experiences

    With the revamped Daydream View, Google has made possibly the most attractive VR headset on the market. But this isn't a case merely of style over substance - there's a lot to like about the search giant's effort and at an excellent price.

    The Google Daydream uses a phone to power your VR experience, but unlike Samsung’s ‘walled-garden’ Gear VR, is not exclusive to Google’s own Pixel phones – it also works with Samsung Galaxy handsets, LGs and oddly the Moto Z, and is expected to support other Android devices in future. The Daydream is best suited to passive (think 360-video and animation) and semi-active content.

    The headset comes with a handheld controller, for easier navigation than with the Samsung Gear VR’s on-headset buttons. The cheapest headset is fabric-covered and designed for comfort. There’s not much content for Daydream yet, but given the cost – not to mention partnerships with Netflix VR and HBO NOW VR – there’s a good opportunity to make your mark using this tech.

    Here's TechRadar's full Daydream View review

    Related articles:

    View the full article


  23. Is your current role holding you back? What do you want from your job this year: progression? New skills? More experience under your belt? Maybe you're motivated by the prospect of a pay rise, or recognition from your peers. 

    No design job is perfect. But if you're no longer being creatively challenged at work, or feel that your skills aren't being fully utilised or appreciated – or you're just not giving it your all anymore – we have good news: there's never been a better time to quit. 

    First, a caveat: we don't mean wildly sticking one to your boss in the morning. These are politically and economically unpredictable times, after all. We're talking about using your initiative to find something more rewarding – and there are plenty of opportunities out there. 

    According to Gov.uk, the number of jobs in the UK's creative industries rose by five per cent in 2016, compared to a 1.2 per cent increase in the wider UK workforce. So what are your options? And how can you make them happen?

    01. Change studios

    Kath Tudball spent almost 15 years at leading London agency Johnson Banks before joining The Partners as design director in early 2016. "I chose to move on when I did because the small physical size of the agency meant there was a natural limit to how far I could progress," she explains. 

    "Joining a larger company gave me the opportunity to lead my own team, work across more projects, experience a wider client mix and take on greater overall responsibility."

    She says that one of the biggest dangers of staying at a studio too long is becoming too comfortable, and not being creatively challenged. "Too much of the same routine can lead to complacency and, at worst, stagnation," she says. 

    "It's better to always feel just a little bit scared. Doing unfamiliar things may be daunting, but it's also incredibly motivating. If you don't have enough new challenges or opportunities coming your way, try to create them. But if that doesn't work, it might be time to move on."

    8ABbtUpuTZWwfGHcpydLGa.jpg

    Kath Tudball worked at Johnson Banks for nearly 15 years before jumping ship

    Her best advice for finding the perfect new job is to do your research. Find out as much as you can about the agencies that interest you and aim for the ones whose work, philosophy and overall approach you genuinely admire. "Real enthusiasm and shared passions will come across and increase the chances of a great fit," she points out. "So who do you really want to work for, and why?"

    She continues. "Also, don't be shy – try getting in touch directly with the people you admire for an informal chat. A personal connection or recommendation of some sort always helps. Just remember: don't act like a stalker." 

    Koto senior brand strategist Tom Moloney agrees that asking people you admire for career advice is a good move. "Ask your mates and colleagues who they rate; where they've worked; who they know. Just don't say, 'I'm thinking about moving on…' first," he laughs. "Also, get your shit together – your CV, website, portfolio; whatever it is. There's no shortcut. Just start doing it."

    Moloney took the opportunity to refocus his career by moving to Koto in September, after six years at NB Studio. "It was a combination of things: a very personal desire for a new challenge, and a professional ambition to focus on brand strategy," he explains. "By moving to Koto, I was able to achieve both of these."

    He agrees that when it comes to knowing it's time to move on from your current role, there are warning signs to watch out for. "If you're not looking forward to going to work the majority of the time, or your motivation is dropping and you know that you're not giving the role or your work your best effort, then it's time to move on," he says. "But that doesn't mean that it's easy to leave somewhere, or to find a new job."

    bJSRbEKb93YvhiHDHfTfGa.jpg

    Watch out for the warning signs that it's time to move on, says Tom Moloney

    This is especially true if you've been out of the job-seeking game for a while, or you've been too comfortable in one role for too long. Many long-serving employees report a creeping uneasiness about the transferable value of their specific skills. If you feel like this, it's a clear sign that you're in danger of becoming institutionalised – and the only way to tackle it is to initiate change.

    02. Start your own studio

    If you're not feeling fully satisfied in your current position, another option is to start your own studio – which is exactly what Studio Texture founder Stuart Youngs did in March 2017. Previously a partner at brand consultancy Purpose, he launched Texture for one reason: autonomy. 

    "I believe it's crucial for studios to explore, experiment and take risks in pursuit of progress," he explains. "It's our creativity and ability to innovate that makes us attractive to clients. But to pioneer takes time, investment and an awful lot of practice. In my experience, that's more difficult to do in a studio with bigger overheads and demands, where failure is often not an option."

    In his new role, Youngs is no longer accountable to a board. He has sole accountability to his family, team and clients. And although he admits this is far more pressure, he can now move faster and is free to make mistakes. "It's sharpened the mind and, interestingly, made me more purposeful," he reflects.   

    So what about Brexit? Given our current political and economical backdrop, is there an argument for staying secure in a role – even if it isn't creatively satisfying anymore? Not according to Youngs. "The age of security has long since gone," he says. "The world is moving too fast for that. Today, it's essential to be looking to tomorrow."

    c6veSo6jZx2wNvZQ7ZeoGa.jpg

    Rather than fit in somewhere else, you could just start your own studio like Stuart Youngs

    For Youngs, the single biggest industry threat faced by designers who want to get a new job is fear, and the paralysis it perpetuates. "We can't afford to sit still and hope," he says. "I believe we're on the cusp of the biggest transformation our industry has ever seen. We're about to enter the age, not just of artificial intelligence, but the more profound augmented intelligence. The consequence is even more pressure on creativity and ideas; on originality and distinction – where the machines can't compete."

    That said, don't feel you have to move jobs for the sake of it. "Nobody should feel uncomfortable just from being in a studio for a long period of time," he points out. "If you're challenged, progressing and fulfilled, you should stay put. The grass isn't greener. Promise."

    And don't move purely for money. "If you're moving for money, you're missing the point. Move for opportunity. Money will follow if you pick the right opportunities and you'll be much happier."  

    03. Get a promotion

    Of course, you don't have to change studios to find new opportunities. Your studio might not be advertising new job roles, but if you can make yourself invaluable to the team, you're in a strong position to negotiate a promotion. 

    Reiss Hinds started at multi-disciplinary design agency BLUP on a three-month placement as a junior designer. During that time, he paid attention to the daily process and workflows used by his directors. "Email was the biggest one," he recalls. "We were going back and forth so many times for alterations, so instead I suggested that we use Basecamp as our project management tool. It's cut down our email time and kept all client services projects in one place."

    NWys6hXKhfqbXbTvnPkAGa.jpg

    Reiss Hinds bagged a promotion thanks to bright ideas and hard work

    He continues: "I tried to provide my directors with as much value as possible – no job was too large for me to tackle. When my three months came to an end, I suggested that there was a need in the business for someone to help streamline and execute on brand strategy, for both our clients and for Studio BLUP's brand."

    His advice? "Find a gap in either the market or in someone else's business that you know you can enhance, and in return you could end up becoming the next big creative in your space."

    04. Move client-side

    Sometimes finding a better job involves playing the long game, as creative entrepreneur Simon Waterfall explains. The former D&AD president first started talking to Airbnb co-founder Joe Gebbia in 2014. 

    Three years later, it took Waterfall – who's co-founded a number of leading digital studios and consultancies, including Poke, Fray, Social Suicide and Deepend – a total of 29 interviews over six months to land his new job as creative director of Samara, Airbnb's recently launched design and innovation studio. 

    That many interviews might have put off other candidates, but not Waterfall. So why was he so committed to moving client-side at Airbnb? "I was looking for a very simple thing: I wanted to change the world," he explains. 

    "How many places, people or brands can do that? Where are they? What do they do? Have they done it before? When you address these points, there are only a handful of companies – and most are in Silicon Valley," he continues. "Working inside means you're already in charge of the biggest asset: the community and audience you want to change."

    hWEwNtax3gveC4fGmts9Ga.jpg

    Simon Waterfall is playing the long game 

    When you're aiming for the stars, like Waterfall, reaching your goals isn't going to happen overnight. He says you have to be prepared to really grind – and advises being patient. "Big dreams need time to solidify," he reasons. 

    And he agrees that the biggest industry threat to designers isn't the likes of Brexit and a flailing economy, but simply sitting still. "It's the tiny, almost unnoticeable threats that are the real killer," he says. "Murder by Powerpoint; death by meetings about meetings. Don't go quiet, my friends: scream into the page and tear it up. Good luck." 

    This article was originally published in issue 275 of Computer Arts, the world's best-selling design magazine. Buy issue 275 here or subscribe to Computer Arts here.

    Related articles:

    View the full article

×