andreas-ink.com http://andreas-ink.com Online Portfolio of Andrea Lovell Sun, 22 Jan 2012 22:47:26 +0000 en hourly 1 http://wordpress.org/?v=3.2 Lion Of Judah logo mark http://andreas-ink.com/2012/01/lion-of-judah-logo-mark/ http://andreas-ink.com/2012/01/lion-of-judah-logo-mark/#comments Sat, 21 Jan 2012 02:30:41 +0000 Andrea http://andreas-ink.com/?p=407 Created a new logo mark for Lion of Judah Songwriting and Studio in Illustrator CS4. For this logo, we wanted to simplify it so it could be versatile for many different mediums and look good at different sizes.

]]> http://andreas-ink.com/2012/01/lion-of-judah-logo-mark/feed/ 0 Pals BEI adaptive layouts http://andreas-ink.com/2011/12/pals-bei-adaptive-layouts/ http://andreas-ink.com/2011/12/pals-bei-adaptive-layouts/#comments Fri, 30 Dec 2011 15:38:32 +0000 Andrea http://andreas-ink.com/?p=396 Media queries and some jQuery were utilized to create the adaptability of this layout. The superfish menu on the site had quite long sub-menu lists so I added jQuery scripts that would take the <ul> and <li> tags  and replaced them with <select> and <option> tags. Once the screen size is small enough for most  smart phones, the large menu converts into a more phone-user-friendly select menu.

Site design © Intellithought

www.palsbei.com

]]> http://andreas-ink.com/2011/12/pals-bei-adaptive-layouts/feed/ 0 Merry Christmas! http://andreas-ink.com/2011/12/merry-christmas/ http://andreas-ink.com/2011/12/merry-christmas/#comments Sat, 24 Dec 2011 15:44:22 +0000 Andrea http://andreas-ink.com/?p=400 Wishing everyone a very Merry Christmas and a happy New Year that will bring more blessings for everyone.

God bless,
-Andrea

]]> http://andreas-ink.com/2011/12/merry-christmas/feed/ 0 Loven Ready Mix Launches http://andreas-ink.com/2011/10/loven-ready-mix-launches/ http://andreas-ink.com/2011/10/loven-ready-mix-launches/#comments Fri, 28 Oct 2011 15:55:56 +0000 Andrea http://andreas-ink.com/?p=381 Intellithought recently launched a new website for Loven Ready Mix located in Pineola, NC. My role was creating the layout and graphics and then building the custom template around the CMS.

http://www.lovenreadymix.com

]]> http://andreas-ink.com/2011/10/loven-ready-mix-launches/feed/ 0 TheEclassifieds mobile stylesheets http://andreas-ink.com/2011/09/theeclassifieds-mobile-stylesheets/ http://andreas-ink.com/2011/09/theeclassifieds-mobile-stylesheets/#comments Sun, 25 Sep 2011 00:53:37 +0000 Andrea http://andreas-ink.com/?p=360 TheEClassifieds.com is a community classifieds website currently serving the East Tennessee and Southwest Virginia area that needed a layout better suited for mobile devices. Before, viewing the site on a mobile device involved zooming in a lot to view the list of items. Intellithought created stylesheets so users can have a more clean, simple layout when on a mobile device.
Visit TheEClassifieds

]]> http://andreas-ink.com/2011/09/theeclassifieds-mobile-stylesheets/feed/ 0 Parallax Effect Theme http://andreas-ink.com/2011/06/parallax-effect-theme/ http://andreas-ink.com/2011/06/parallax-effect-theme/#comments Sun, 19 Jun 2011 00:12:26 +0000 Andrea http://andreas-ink.com/?p=325 Like Nike Better Worlds Site? Want the same sort of effect for your WordPress site? Then check out Theme Spectrums new theme. This theme would be great for artwork or photography and it’s as easy as adding a new post and setting a featured image for the background image. See the demo here.

]]> http://andreas-ink.com/2011/06/parallax-effect-theme/feed/ 0 Using Media Queries for Adaptable Layout http://andreas-ink.com/2011/06/using-media-queries-for-adaptable-layout/ http://andreas-ink.com/2011/06/using-media-queries-for-adaptable-layout/#comments Sun, 19 Jun 2011 00:00:38 +0000 Andrea http://andreas-ink.com/?p=322 Lately I’ve been experimenting with css3 Media Queries for different themes I’ve been working on at work. I decided to give it a shot on my website since the front page uses jQuery Masonry and it was already close to being an adaptable layout on its own. I have been reading up on Media Queries and made a separate style sheet for the elements affected. All it takes is that separate stylesheet, a Javascript fallback for Internet Explorer 8 and less, and a meta tag to reset iPhone viewport & the initial scale. Enough of that; to see it in action, just re-size your browser window to a narrow width back and forth.

Some helpful links discussing this:

http://webdesignerwall.com/tutorials/adaptive-mobile-design-with-css3-media-queries

http://www.alistapart.com/d/responsive-web-design/ex/ex-site-FINAL.html

]]> http://andreas-ink.com/2011/06/using-media-queries-for-adaptable-layout/feed/ 0 Everyone Check out Theme Spectrum http://andreas-ink.com/2011/05/everyone-check-out-theme-spectrum/ http://andreas-ink.com/2011/05/everyone-check-out-theme-spectrum/#comments Sat, 14 May 2011 05:46:13 +0000 Andrea http://andreas-ink.com/?p=269 Attention anyone looking to start a site or blog – especially artists and designers — Theme Spectrum is a new site developed by Today in Art which is a site owned by my co-worker. Jeff and yours truly  have been developing customizable WordPress themes geared towards artists, but anyone can use these. They’re super easy to use and support won’t be hard to track down since I helped develop these. So go on check it out – http://www.themespectrum.com – more themes to come! We have some really cool ones in production right now!

]]> http://andreas-ink.com/2011/05/everyone-check-out-theme-spectrum/feed/ 0 Times Digital Group Logo http://andreas-ink.com/2011/03/times-digital-group-logo/ http://andreas-ink.com/2011/03/times-digital-group-logo/#comments Sun, 20 Mar 2011 14:04:32 +0000 Andrea http://andreas-ink.com/?p=275 Designed logo for Times Digital Group – a marketing and design service agency in Kingsport. This logo was created in Illustrator and includes a flat 1-color version for print purposes and footer includes.

]]> http://andreas-ink.com/2011/03/times-digital-group-logo/feed/ 0 Good Day Winter Cardinal http://andreas-ink.com/2011/03/good-day-winter-cardinal/ http://andreas-ink.com/2011/03/good-day-winter-cardinal/#comments Sun, 13 Mar 2011 05:10:02 +0000 Andrea http://andreas-ink.com/?p=263 Saw this cardinal hanging outside while I was on my lunch break a couple of weeks back and was able to get a good zoom from my window. Thought I’d share :)

]]> http://andreas-ink.com/2011/03/good-day-winter-cardinal/feed/ 0 Work Flow: James Dean typography portrait http://andreas-ink.com/2011/03/work-flow-james-dean-typography-portrait/ http://andreas-ink.com/2011/03/work-flow-james-dean-typography-portrait/#comments Sun, 06 Mar 2011 23:52:28 +0000 Andrea http://andreas-ink.com/?p=167 Recently, I got an email from someone asking me how I did the James Dean portrait. So instead of trying to answer that back in a rambling email that probably wouldn’t make much sense, I opened up the file and found my work layers and will share them to better illustrate how I did this. I made this about 2 years ago when I first started seeing typography portraits but I wasn’t sure how to go about this. I experimented with a few things and this is what I came up with. The way that I made this is certainly not the only way to produce this and I will add some links to some other good tutorials for this. I made this project with Adobe Illustrator, but can be made with Photoshop and other graphics programs.

First, I selected my image and placed it in illustrator. Usually using a image with lots of shadows on the face will help give it a cool final effect. I chose this photo of James Dean mainly because I’m such a huge fan and because I wanted my final image to have a dark simple black & white result.
Next, I used the Pen Tool (P) to start drawing simple contour lines around the head, neck, and body paying special attention to the face drawing around the bridge of the nose and lips. After each line, I hit Enter to stop that line and start a new one. I also made different contour lines going in different directions for the ears and the pupils. For this project, I just stopped midway down the body area and left the hands out.
Once your contour lines are in place and are happy with them, now you can start typing your text on each of the contour lines. I used lines from the movies Rebel Without a Cause, Giant, and East of Eden – for obvious reasons :) . Don’t worry if your text doesn’t “line up” or fit within the lines – we will take care of that with the next step.  Now, with your text added, start playing with the text. Resize the text, change fonts, adjust the size, kerning (space between the letters), and even the rotation of the letters. All of that can be adjusted in the Character window (Window > type >character or “ctrl T”). Tip – use “thicker” fonts for more filled in (light) areas that will help with the form.
Once, you have your text filling between the contour lines (it doesn’t have to be perfect), select all the text and outline it – Type > Create Outlines or Shift Ctrl O. The text may leave you with some jagged edges around the person so if needed, use the pen tool to draw around the body in the original image. Make sure that shape is over the outlined text, select both the text and shape then make a clipping mask (Object > Clipping Mask > Make). You may need to place some extra letters in the whites of the eyes just to fill it out and make it stand out more.
Now, this is the part that will really bring the portrait to life. Take the original portrait and desaturate it completely and Invert the colors. Place the inverted image over your outlined text and select both. Go to Window > Transparency to open the Transparency window. With text and inverted image still selected go to and click the small arrow on the transparency window to get the drop down menu and click Make Opacity Mask. If it doesn’t look the way it should, try clicking the “Invert Mask” checkbox.
And this is the final result I came up with. I’m sure there are plenty easier ways to achieve this and many effects that can be added to something like this.  Now I will include a list of links to explain this better and for you Photoshop users. Feel free to add your typography portraits or your tips on how to create these. 

http://layersmagazine.com/photoshop-cs4-a-picture-worth-a-thousand-words.html

http://psd.tutsplus.com/tutorials/text-effects-tutorials/how-to-make-a-typographic-retro-space-face/

http://naldzgraphics.net/tutorials/how-to-create-a-simple-face-text-portrait-in-photoshop/
]]> http://andreas-ink.com/2011/03/work-flow-james-dean-typography-portrait/feed/ 0 Hello Again! http://andreas-ink.com/2011/02/hello-world/ http://andreas-ink.com/2011/02/hello-world/#comments Sat, 19 Feb 2011 22:30:09 +0000 Andrea http://andreas-ink.com/?p=1 Welcome! I finally got this site updated and we’re back. Aside from a new(ish) look, I’ve also got the site running with WordPress which will make it tons easier to update and add other content along with links from other design and development buddies. As always, any questions/comments – feel free to contact me from the contact form. I’m still going to be working out the kinks and adding more content so bear with me in the next week or so. Thanks for visiting!

]]> http://andreas-ink.com/2011/02/hello-world/feed/ 0 Watson’s Marine Website http://andreas-ink.com/2010/12/watsons-marine-website/ http://andreas-ink.com/2010/12/watsons-marine-website/#comments Sat, 18 Dec 2010 03:55:08 +0000 Andrea http://andreas-ink.com/?p=226 Watson’s Marine had me design their new logo and layout for their updated website. The client wanted to use their black and red colors more prominently on the new site and feature a lot more product and boat pictures.

http://watsonsmarine.com

]]> http://andreas-ink.com/2010/12/watsons-marine-website/feed/ 0 Virginia Intermont http://andreas-ink.com/2010/11/virginia-intermont/ http://andreas-ink.com/2010/11/virginia-intermont/#comments Sun, 14 Nov 2010 03:40:00 +0000 Andrea http://andreas-ink.com/?p=213 Virginia Intermont had Intellithought design and develop an entirely new website for them working with a CMS for them to add posts to. My role was the css and layout development, custom jquery slider for spotlight posts, and flash work for the home page slider.

design © intellithought

www.vic.edu

]]> http://andreas-ink.com/2010/11/virginia-intermont/feed/ 0 Intellithought new logo mark http://andreas-ink.com/2010/08/intellithought-new-logo-mark/ http://andreas-ink.com/2010/08/intellithought-new-logo-mark/#comments Fri, 20 Aug 2010 03:59:14 +0000 Andrea http://andreas-ink.com/?p=228 Created new logo mark for the company I work for. They were wanting a logo that  emphasized their main 3 services. This was created with Illustrator and included a flat one-color version for print etc.

]]> http://andreas-ink.com/2010/08/intellithought-new-logo-mark/feed/ 0 Comptons Flooring http://andreas-ink.com/2010/08/comptons-flooring/ http://andreas-ink.com/2010/08/comptons-flooring/#comments Sun, 01 Aug 2010 04:02:57 +0000 Andrea http://andreas-ink.com/?p=230 Developed my Grandfather’s hardwood flooring site around a CMS so they could go in and add/delete specials and change content.

http://www.comptonsflooring.com

]]> http://andreas-ink.com/2010/08/comptons-flooring/feed/ 0 MS Walk team shirt design http://andreas-ink.com/2010/03/ms-walk-team-shirt-design/ http://andreas-ink.com/2010/03/ms-walk-team-shirt-design/#comments Wed, 17 Mar 2010 04:06:22 +0000 Andrea http://andreas-ink.com/?p=232 Created tshirt design for a friend’s team that walked in the 2010 MS Walk in Indiana. The name of the team was ‘Wiggle WorMS’.  Designed in Illustrator

]]> http://andreas-ink.com/2010/03/ms-walk-team-shirt-design/feed/ 0 James Dean Typography Print http://andreas-ink.com/2009/12/james-dean-typography-print/ http://andreas-ink.com/2009/12/james-dean-typography-print/#comments Fri, 11 Dec 2009 04:11:55 +0000 Andrea http://andreas-ink.com/?p=235 Personal project I worked on experimenting with type on path and gradient masks in Illustrator.

]]> http://andreas-ink.com/2009/12/james-dean-typography-print/feed/ 0 2009 Downtown Halloween Pub Crawl Site http://andreas-ink.com/2009/11/2009-downtown-halloween-pub-crawl-site/ http://andreas-ink.com/2009/11/2009-downtown-halloween-pub-crawl-site/#comments Sun, 01 Nov 2009 04:14:36 +0000 Andrea http://andreas-ink.com/?p=237 Took pictures and designed graphics for the flash site promoting 2009′s Halloween Pub Crawl in downtown Kingsport.

]]> http://andreas-ink.com/2009/11/2009-downtown-halloween-pub-crawl-site/feed/ 0 L.I.O.N. Envy website http://andreas-ink.com/2009/09/l-i-o-n-envy-website/ http://andreas-ink.com/2009/09/l-i-o-n-envy-website/#comments Wed, 16 Sep 2009 04:18:02 +0000 Andrea http://andreas-ink.com/?p=239 Worked closely with owner of a clothing company based out of Corona, CA. I Designed the layout and built the site around their logo that featured videos, a online store to shop, and lots of promotional photos. Site created using HTML and Flash.

http://www.envyclstore.com

]]> http://andreas-ink.com/2009/09/l-i-o-n-envy-website/feed/ 0