articles on
Friday Fresh Free Fonts #19
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF #19 and make sure to comeback for more next week. ChunkFive by Graham Smith Download ChunkFive Turnpike by Font Diner Download Turnpike Virgo 01 by Vic Fieger Download Virgo 01 Oceania by Morice Kastoun Download Oceania
Inside the Studio of Hand Made Font
Straight from Estonia, the guys from HandMadeFont give as all access to their studio and tell us a lot of special details about their incredibly typography and font work done by hand. HandMadeFont.com Who hides behind this studio that creates such awesome typography and hand made fonts? The names behind HMD are; Maksim Loginov and Vladmir Loginov. We are brothers that have been working in graphic design for ten years. We grew up altogether with our parents, until we became 20 years old and we adopted oneself to each other. Nevertheless we are different. We have different interests. Maxim likes to word in a 3D, anime, japanese dolls. Vladimir likes modern art and photography. Vladimir in indulge in documental movies and lately he gained some prizes on a several filmfests. Despite of the fact, that we are very different, we easily find common language. In a HandMadeFont project, we didn?t determined any limits for each other. Everyone does what he wants and that got to be respected. The names behind HMD are; Maksim Loginov and Vladmir Loginov. We are brothers that have been working in graphic design for ten years. How the idea of creating all kinds of hand made fonts started? Very often we had to create unique fonts for different advertising campaigns, posters, tv-ads etc… And the final result, after putting so much effort into it, would only last for a month or two. We felt sorry that no one would ever see those works again. So we decided to give them a new lease of life. That’s how the idea of HandMadeFont came up. We’ve completed the alphabet and the process turned out to be so exiting that we ended up with loads of new fonts. the process turned out to be so exiting that we ended up with loads of new fonts Where all these great hand made fonts get created? For now on we work together in a big advertising company AGE McCann (Estonia). Studio locates in a Tallinn center. We have beautiful views to the old town from the studio windows. There are 25 persons in the studio and a very creative atmosphere. For example, in the studio we have a hookah, playstation, ping-pong table… You can always have a break and relax or play. We collect nothing, but we buy and read a lot of different books, as a designer ones, or fiction. But this is not a collection. This is just a way of life. in the studio we have a hookah, playstation, ping-pong table… You can always have a break and relax or play Do you believe that the atmosphere you work in can influence on the actual work? Of course, the atmosphere in the studio is 50% success. And maybe more. The process of the birth of ideas is very difficult to organize. Especially when it is necessary that ideas are born every day. It's very good when in the studio you do not feel like at work. And when the work becomes a favorite thing that you just pleased to do. the atmosphere in the studio is 50% success You guys have done endless number of different and very unique hand made fonts. What inspires you the most to keep creating all these different fonts? If we only knew, where they come from (especially the genius ones), we would be very rich. But in our case it is more simple. “In the beginning, there was a word...“. Every object has its own name. Every word consists of some letters. It means, that every word implies some shape. For example, imagine a pencil on a table. We take a lot of pencils and compose a word "pencil“. This is a beginners level. But, going further on, if we compose a word "painter“ using the same pencils, then we receive the shape of the word "painter“, which expands itš sence. We’re all surrounded by the lots of different things, which can be made into a font. Often we follow our instincts rather than just logic in choosing something. It’s like a man scratching the name of his beloved on some tree never thinks what font he’s using. Same with us. First we make something, than look at the result. Sometimes it’s no good , but usually we are happy with the first choice. It has more integrity and the spirit. The quirkiness of our fonts and the raw feel to it is important to us. It has energy. We never think, how anybody can use our prints, because it is a dead-end. We do not deal with a conveyor manufacturing. Sure the project we launched is commercial, but in the very beginning we assumed to cooperate with magazines and advertising companies, not just selling a variety of ready prints. Of course we like to sell our jobs, it is interesting. But we are designers, not top sales managers. We like to create something new. At the moment we cooperate with several magazines, composing unique headlines. We are always open to new offers. Every object has its own name. Every word consists of some letters. It means, that every word implies some shape After you get the first idea for a new font and you decided to go ahead with it, do you have a set process that is always used in order to create the whole font set? Usually, we start with one letter. Then we compose a word to see how the letters look altogether. If we like it, we continue with it. If we don't, then we start from the very beginning. Sometimes one letter making lasts too long, so we refuse to continue. It doesn't mean that we afraid of difficulties. We just do not want to have it in a routine way. We just do not want to have it in a routine way. How long does it usually take? It all depends on the material we use to create a font. Basically we use anything. Hammer, matches, scissors- anything that cuts, saws or whatever. Every material requires a different approach. Take liquids, for instance. It’s hard to create a model from liquid- it has no shape. Our job is to find a right shape for it. You see, it’s not easy to apply standard terms of typography to describe what we do. They are not classic fonts, everyone is used to. We’re not exactly the specialists in this field, it’s hard to be a specialist in squeezing letters out of ketchup or cutting forms out of loaf of bread. We try various things and methods and share the results with people. One of the hardest was the "red caviar" one. We wanted to take some pictures of red caviar first. But this was such an expensive and tasty product, that it didn’t make it to the session. We’d eaten all of it and had to recreate it in 3d. It came out even better than the real thing. When we earn our first million we’ll use black caviar for a font. it’s not easy to apply standard terms of typography to describe what we do After making so many different fonts, do you have any favorites or a special one? Our favorite font is the one made by our mother. It’s the red knitted letters. Our mum knits. So we’ve asked her to knit the letters from the sketches we’d made. She did the whole alphabet in two days. We couldn’t have made anything like that in a hundred years. It’s really special to us. Our favorite font is the one made by our mother Are you guys working on any project we should know about? We have plenty of ideas. Currently we are in a process of creating some 200 new fonts. Almost anything can be made into a font. We have a few ideas about using people and animals in our work, and this requires a totally different approach. So far we’re not ready for it. Maybe some day. We have a few ideas about using people and animals in our work Thank you very much for the interview, you guys are great. I'll leave the last words up to you. Incidentally, this October is the birthday of our studio. We are one year old and this interview is a good gift. Thank you.
Friday Fresh Free Fonts #18
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF# and make sure to comeback for more next week. Future Sands by Jerry Rose Download Future Sands St Transmission by Sascha Timplan Download St Transmission Sonrisa Thin by Jason Castle Download Sonrisa Thin Age 11 by HVD Fonts Download Age 11
Friday Fresh Free Fonts #17
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#17 and make sure to comeback for more next week. Etcetera by Lifter Baron Download Etcetera Pasta Simpla by fabergraph Download Pasta Simpla Sketch by Sergiy Tkachenko Download Sketch FF Dagny OT Thin by FontFont Download Dagny OT Thin
Super Easy Neon Style in Photoshop
This past Friday was the Abduzeedo meetup here in my hometown of Porto Alegre. It was really cool, we had a lot of fun and a lot of beers! When I was leaving I noticed the neon sign outside the pub and it really inspired me to create a tutorial on how to acheive that type of effect in Photoshop. In this tutorial I will show you how to create a nice light effect in Photoshop. We will use Layer Styles and Blend Modes to simulate a neon text effect. Step 1 Open Photoshop and create a new document. I used 1920x1200 pixels. After that import a brick texture, the one I used was a courtesy of Shutterstock and you can download it here Step 2 With the texture layer selected go to Image>Adjustments>Hue and Saturation. Use 0 for the Hue, 45 for the Saturation and -85 for the Lightness. Step 3 Add a new layer and go to Filter>Render>Clouds. Make sure you had black and white for the foreground and background colors. With the Eraser Tool (E) delete the areas close to the edge and leave just the center of the image. After that change the Blend Mode to Color Dodge. Step 4 Import the logo you want to use for the neon effect. I'm using the ZEE logo I created a few weeks ago. Duplicate the layer and hide it because we will need to use a few copies later on in this tutorial. Select the visible logo layer and go to Filter>Blur>Gaussian Blur. Use 15 pixels for the Radius. Step 5 Follow the images below for the settings of the Layer Style. We will be using Drop Shadow, Inner Shadow, Outer Glow, Bevel and Emboss and Color Overlay. Step 6 This will be the result you will get after the layer style. Step 7 Duplicate the layer with the layer styles to make the effect a bit stronger, but reduce the opacity to 50%. Step 8 We will need another layer with the logo without any layer style applied to it. Put this new logo on top of the others and then go to Filter>Blur>Gaussian Blur. Use 100 pixels for the Radius. Also change the Blend Mode to Color Dodge. Step 9 Now with the Brush Tool let's create the base part of the neon that will be fixed on the wall. Use black for the color and put this behind the neon layers. After that go to Layer>Layer Style>Bevel and Emboss. Use the image below for the values of the Bevel and Emboss. For the "E" base use -160º for the angle and for the "Z" base use 0º. Step 10 Again with the Brush Tool (B) and a very soft brush, using 0 for the hardness, add a new layer behind the layers created in the previous step. So just paint a very soft shadow. Conclusion Light effects are always really cool for wallpapers, I'm really addicted to these types of effects and in this tutorial I showed you how to create a neon effect. Basically, the effect is all about layer styles and blend modes. Now, it's up to you. You can try different colors and backgrounds but the technique won't change that much from this one. Click on the image for full preview Download the Photoshop file Click here to download the Photoshop file used for this tutorial
Friday Fresh Free Fonts #16
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#16 and make sure to comeback for more next week. Dollis by Benoît Sjöholm Download Dollis Palm of Buddha by Dan Vuletici Download Palm of Buddha Neogrey Medium by Ivan Philipov Download Neogrey Medium GoodDog by fonthead Download GoodDog
Friday Fresh Free Fonts #15
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#15 and make sure to comeback for more next week. Magenta by Bamboo Types Download Magenta Agnes by Calame Design Download Agnes Comfortaa by Johan Aakerlund Download Comfortaa Monkey Love by iLuv Color Download Monkey Love
Friday Fresh Free Fonts #14
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#14 and make sure to comeback for more next week. Caprica by BigYellowBiohazard Download Caprica Ganix Apec by KeepWaiting Download Ganix Apec Hunstruct by John Skelton Download Hunstruct Neucha by Ivan Gladkikh Download Neucha
Friday Fresh Free Fonts #13
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#13 and make sure to comeback for more next week. OricNeo Stencil by Jonathan Hill Download OricNeo Stencil Coldi by Alessio Avventuroso Download Coldi Gordana by Alberto Rodríguez Download Gordana Thunderball by John Skelton Download Thunderball
Case Study - The V Dimension
We have already featured Johannes Aagaard here on Abduzeedo. Johannes is a graphic designer from Denmark with a nice set of works mixing typography illustration with some photo manipulations. Now we have a very cool Case Study of one of his works, The V Dimension, which is really well done. I am a danish graphic designer/artist - who pass by your site everyday. I find great inspiration in your threads, and am thankfully for your blog service exists - I think it helps lots of artist, to get inspiration. We highly recommend that you check out his website at http://www.kongesuiten.dk/aagaardds
The Impressive Work of Alex Varanese
Alex Varanese is a graphic designer and creative director from San Francisco, USA. Alex has some really cool Typeface designs and an impressive portfolio with a beautiful retro feel. I highly recommend that you visit Alex's website at http://www.alexvaranese.com/ Alex is: an ardent believer in hard determinism, and wishes he were better friends with fate. Is guilty of an overuse—but never misuse—of the word "literally". Spends nights and weekends trying to repair his time machine.Draws upon a limitless supply of cheeky quips designed specifically for ironic post-hipster posturing. Likes red more than you do. Some Print Works Typefaces
Shiny Calligraphy Text Effect in Photoshop
Last week I posted some articles about typography and received quite a few emails asking me to create a tutorial on text effects. So I decided to play a bit with Photoshop to create a nice sort of 3D effect using a calligraphy font and a lot of Layer Styles. The effect is really simple and we will take a look at how to create patterns and light effects with Blend Modes. Step 1 Open Photoshop and create a new document, I used 1920x1200 pixels for the Size. Then fill the background with a very dark color #1f1e1e. Step 2 With the Background layer selected go to Layer>Layer Style>Gradient Overlay. Choose grey (#707070) and white for the colors. Change the Blend Mode to Multiply and the Opacity to 60%. The Style will be Radial. Make sure that the white is in the center. What will happen is that as we're using multiply the edges of the image will be darker. I'm applying this gradient via layer styles because I want to add a filter to the layer later on and then I will be able to try different colors. Step 3 Now go to Filter>Noise>Add Noise. Use 2%, Gaussian and make sure you selected Monochromatic. Adding noise to gradients is really good because it makes the gradient more subtle. Step 4 Let's add the text. We will need a caligraphy style font, I'm using Champignon and you can download it at http://dafont.com. Type Abducted first. Step 5 Now right below the "Abducted" line type "by". I used another font for it, "Champignon Alt S..." and you can download it at http://dafont.com as well. Use the image below for reference of position and try to connect the words like the "Bs". Step 6 Type the word "Design". Pay use the end of the "y" to connect with the "D", it's very important that the words connect otherwise the effect won't work as well. Step 7 To make the effect more attractive let's add some swirls. This is pretty much the same thing I did in another tutorial the Swirl Type in Photoshop. But basically, let's import a swirl element and place it before the "A". The one I'm using was courtesy of Shutterstock and you can download it here Step 8 Place another element in the end of "Design" using the "n". I used the same element that I used in the previous step, just a little smaller. Step 9 Now add another swirl in the "Y". Step 10 Now that you have the text with the swirls convert it to Smart Objects. That way we can edit it anytime. Then go to Layer>Layer Styles>Gradient Overlay. Use Pink and Blue for the colors, Linear for the Style, and 90º for the angle. Step 11 After the Gradient Overlay select Drop Shadow. Use Multiply for the Blend Mode, 120º for the Angle, 5 pixels for the Distance and 20 pixels for the Size. Step 12 After the Drop Shadow select Bevel and Emboss. Use Inner Bevel for the Style, Smooth for the Technique, 190% for the Depth. For the Direction use Up, for the Size use 6 pixels and 8 pixels for the Soften. Now for the Shading part use 120º for the Angle, 30º for the Altitude. For the Highlight Mode use Color Dodge and white for the color with 75% Opacity. Then for the Shadow Mode use Multiply and black for the color with 45% Opacity. Select Contour as well. Step 13 Duplicate the text layer and the the first thing to do is change the Fill to 0%. That way there won't be any color but the Layer Style will still work over a transparent layer. Disable the Gradient Overlay as well. For the Bevel and Emboss change the Direction to Down. Also increase the Depth to 370%. For the Size use 2 pixels and 8 pixels for the Soften. Now for the Shading, change the Angle to 145º, Altitude to 25º. The Highlight Mode will be Screen with white for the color and 100% Opacity, while the Shadow Mode will be 0%. Step 14 Duplicate the layer again to make the effect stronger. Step 15 Duplicate the layer again but this time let's edit the Bevel and Emboss. Change the Soften to 1 pixel. For the Highlight Mode use Color Dodge with 70%. Also disable the Drop Shadow. Step 16 Now let's create a Pattern to use in our design. Create a new document with 40 pixels for the width and 200 pixels for the height. Step 17 Resize the background layer so it will have 20 pixels width. The Fill the Layer with a Lienar Gradient using white for the color but different Opacities. Use 100% to 40% for the Opacities of the Gradient. Use the image below for reference. Step 18 Go to Edit>Defin Pattern. Name it Stripe and you have a nice Pattern. Step 19 Back to our design, add a new layer and fill it with the Pattern you have just created. Step 20 Rotate the layer with the pattern and change the Blend Mode to Soft Light. Step 21 Holding Command on a MAC or Control on a PC, click on the thumb of the text layer in the Layer Panel. That way you will create a marquee selection of the text layer. It's pretty simple and very useful. After that go to Layer>Layer Mask>Reveal Selection. The pattern will be applied only over the text. Step 22 Select all layers used to create the text effect and duplicate them. The go to Layer>Merge Layers. After that go to Filter>Blur>Gaussian Blur. Use 10 pixels for the Radius and press OK. Change the Blend Mode to Screen, that will add a nice glow to the image. Step 23 Let's add some light effects. I'm using a stock photo to create the lens flare, you can use brushes or even the Lens Flare filter. The image I used can be downloaded here. Place just the lens flare in the design and change the Blend Mode to Screen. After that go to Image>Adjustments>Hue and Saturation. Select Colorize and change the Hue Until you get a color that matches the color of the part of the text effect the light will be over it. Step 24 Duplicate the Light Effect and move it over another letter. Step 25 Duplicate the lens flare again and move it over another part of the design. Go again to Image>Adjustments>Hue and Saturation and once again select colorize and try to match the color of the lens flare with the design. Step 26 Import a paper texture and place on top of the other layers. The image I used is courtesy of Shutterstock and you can download it here. After that change the Blend Mode to Multiply. Conclusion You can add a space scene beneath it as well or just leave it over the noise background. Also if you want to add more glow to the image, just duplicate all layers and merge to a new one, or simply press Command(MAC)/Control(PC)+Alt+Shift+E. Then apply a Gaussian Blur with 20 pixels for the Radius and change the Blend Mode to Screen. The idea of this effect was to play with the Layer Styles to create a nice text effect in a caligraphy font. Also we went through the process of creating a pattern of stripes. The idea of this tutorials is to show some techniques that can be applied to your projects, not just how to create the design, I believe the design is just to show you an example. Now it's up to you. Click on the Image for full preview Variations Click on the Image for full preview Click on the Image for full preview Download the Photoshop file Click here to download the Photoshop file used for this tutorial
Calligraphic Paintings by Jose Parla
José Parlá's - who now works in New York - created his own unique style which reminds of great calligraphic letters. His life, like his work, is at once extremely particular and generally reflective of the wanderings of today's urban populations. Each painting bears the name of the location or experience from which it draws its source. My work is inspired by the anonymous art found in the streets. The art is often in the form of calligraphy or the actions of torn and stripped posters. The inscriptions in my work are used as a form of drawing, and to maintain a record of my observations. In my travels I have encountered a similar dialogue that takes place in most cities. I find compositions on surfaces of deteriorated walls, and remnants of construction markings. In my paintings I create layers and textures representing the age of memories collected through different periods of my life. Evidence is left on walls by fleeting creators both aware of their message, or oblivious to what I may find in their signs. Still, they remain mostly unidentified. When working on my paintings I imagine different people are making choices to write, paint, or destroy the surfaces. To do this I employ techniques to age my work, adopting materials normally used in construction. I am using my imagination to capture the psychology of a segmented reality. These realities which are deposited into our subconscious everyday are the basis for a dialogue that goes mostly unnoticed. Once these "segmented realities" or images are transferred and converted into paintings they become a "memory document" , a sort of time capsule for my experience in history. With this language I hope to communicate and provoke thoughts of the past and present conditions in the human spirit. Where to find him on the web JoseParla.com - Website & Portfolio Where to find him on the web JoseParla.com - Website & Portfolio
Friday Fresh Free Fonts #12
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#12 and make sure to comeback for more next week. Clipper Designed by Dominic Le-Hair Download Clipper Handmade Designed by Rashid Akrim Download Handmade Metro Designed by Ivan Gladkikh Download Metro Badabum Designed by Jonathan Calugi Download Badabum
Beautiful Type Illustrations by Nicolas Girard
Nicolas Girard is a French Canadian graphic designer very passionate about type and motion graphics. In his portfolio we can see some amazing type illustrations with a very retro feel. Nicolas has an online portfolio at http://goodmorningstranger.com/ and we highly recommend that you check it out. I am a French Canadian Graphic Designer working for MuchMusic in Toronto. I also do freelance projects in motion graphics and type illustrations Work Demo Reel
Friday Fresh Free Fonts #11
I will be posting some fresh free fonts every Friday, yes I know it's awesome. I will look forward to bring a lot of great fonts that will sure help you improve your typography work. Check out what I selected for you on the FFFF#11 and make sure to comeback for more next week. Groteska designed by Alberto Rodriguez Download Groteska Maze designed by Font Soup Download Maze Days Designed by Aleksey Maslov, Ivan Gladkikh, Alexandr Kalachëv Download Days Clutchee designed by Sinisa Komlenic Download Clutchee
Super Cool Retro Poster in 10 Steps in Photoshop
A couple of weeks ago Amanda (@amlight) published a few articles showing stylish posters and albums with a very retro style, very simple but at the same time really cool. The articles really inspired me so I decided to create an Abduzeedo poster for myself just to play with Illustrator and Photoshop. So in this tutorial I will show you how to create a very cool poster in just 10 steps. We will use Adobe Photoshop and Illustrator, but you may use other tools. I'm working on the Pixelmator version as well. Inspiration and Sketches Step 1 After a few ideas on paper it's time to start designing it. For the base of the typography I used Illustrator. So I searched on Google Images for "Avant Garde" and select an image that had the "A" with the style I wanted. Then in Illustrator, using the Pen Tool (P) create the "A". You can hold the SHIFT key to make sure the lines are straights. With the "A" done, select the Type Tool (T) and type the BDZ using the font Avant Garden. Step 2 Select the text created and go to Type>Create Outilines. Then with the Direct Selection (A) select the vertices of the base of the Z and the move them down like the image below. Step 3 Now open Photoshop and create a new document, I used A4 for the size. Then fill the Background layer with a brown (#573E2A). After that copy the text created in Illustrator and paste it in Photoshop as Shape Layer. That way we can keep playing with the vectors using the Path Selection Tool (A) and Direct Selection Tool (A). With the Direct Selection Tool (A) move the base of the A, the straight one move all the way down until it reaches the base of the "Z" (1) and the other move all the way to the edge of the document (2). Using the Pen Tool (P) and create some points at the top of the B and make it go all the way to the top (3). Step 4 With the Direct Selection Tool (A) select the B element and copy and past it in a new layer. Then with go to Layer>Layer Style>Color Overlay. Use #FC9E1D for the color. Step 5 With the Lasso Tool (L) select the area below the A exactly like the image below. Then create a new layer and fill it with white. Just the selected area. Step 6 Go to Layer>Layer Style>Color Overlay. Use green for the color #6F7A38 and Multiply for the Blend Mode. Then select Pattern Overlay. For the Pattern select the Graph Paper. It's under the Color Papers preset. Also increase the Scale by 300%. Step 7 Now let's add some text. For the font I used Dirty Headline, you can find it at dafont.com. Place the text in the green area like the image below. Also you can add a very subtle shadow. Go to Layer>Layer Styles>Drop Shadow. I used 35% Opacity, 2 pixels for the Distance and 10 pixels for the Size. Step 8 It's time to add some textures. The one I used is from Shutterstock and you can download it here http://www.shutterstock.com/pic-35221027/stock-photo-old-paper.html Place it in your document on top of the other layers, then change the Blend Mode to Multiply. Also go to Image>Hue and Saturation and reduce the saturation so the image won't get it to yellowish. Step 9 Now you may add some dirty elements using Brushes like to make the lines less uniform for example. I used some brushes from Eduardo Recife's Misprintedtype site. http://misprintedtype.com Conclusion In less than 10 steps we're able to create a really cool retro style poster, very stylish. The secret is simplicity, color and textures. Of course you might like it without the brushes and dirty effects, or you want to try different colors, I created 2 other versions with cold colors and also playing with a photo in the background. Now it's all about playing and testing different variations. I'll print a copy for me, and hang it on my wall. :) Version 1 Version 2 Version 3 Download the Photoshop File Download the Photoshop file used for this tutorial