Design & Development Blog | Jared Lunde

DISQY – the web’s most viral videos

Jared Lunde — Sat, 04 Sep 2010 02:52:18 +0000

Recently I had the pleasure of working on a project called DISQY. DISQY is a video aggregator that searches the Internet for the most mentioned videos each day. It then applies an algorithm to what it finds and decides which videos are the most influential and which are spreading the fastest. The most viral videos are then ordered and placed on the homepage with the most viral video that day getting embedded right at the top. Videos can also be sorted by the most viral each day, week and month. There is also an “upcoming” page which displays videos that aren’t viral yet but are spreading more quickly than the other videos on the site and may soon make the jump to being viral.

The video pages themselves offer up cool charts that are updated each hour and show how and where videos are trending. Users on the site can then react to each video with comments and preselected phrases such as:

This video made me… cry

This video made me… OMG

Users can also submit videos to the site themselves from a choice of around 10 of the largest video sites on the Internet. This gives them the ability to gain clout on the community by finding material before other people and before the site itself finds it. Another cool feature that members of the site are given is the ability to create playlists featuring their favorite videos.

Overall DISQY is a fun site for the casual visitor or the hardcore user.

Check out DISQY

Le Gossip – Celebrity Gossip Revisited

Jared Lunde — Fri, 27 Nov 2009 23:35:33 +0000

One major problem a user experiences when trying to stay on top of celebrity gossip on the Internet is that most celebrity news sites have a lack of direction and clear organization. Le Gossip aims to change all of that by striving to deliver better information on a more organized platform.

This quick project was the brainchild of my business partner Troy Osinoff and myself. Designing the Le Gossip brand was far from easy. We did extensive research on the pros and cons of typical celebrity news sites, took the typical headlines and photo albums and essentially made the path to information a more concise and easy for the visitor. The site is scheduled to hit the web early next week.

Logo Design Process
We wanted to position the site as being more MTV-cool and less TMZ-cheesy. The logo itself was made to appeal to young women and teens. It is clean and simple, but rough in a way that makes it look like Zac Efron’s hair when he wakes up in the morning. Here is the grid representation and kerning model for the logo:

Earlier versions of the logo I did seemed a little bit too kids-boppish and I think that this one does a really good job at staying more age-neutral, yet hip.

Logo Design Love Interview with Tom Geismar

Jared Lunde — Fri, 27 Nov 2009 22:10:15 +0000

I read this Tom Geismar interview on Logo Design Love today and I suggest anyone interested in logo design read it, too. Tom is truly one of the great logo designers of our time and his firm Chermayeff & Geismar, inc. is responsible for some of the most icon logos of all time including Chase, Mobil, the Rockefeller Center and my personal favorite NBC. The firm’s logos are a testament to the fact that a good logo does not and should not require the use of photoshop or illustrator filters in order to be unique.

Further reading on Chermayeff & Geismar can be done on this article from Logo Design Love and this article from AIGA.

Humbling Displays of Typography

Jared Lunde — Tue, 24 Nov 2009 05:30:11 +0000

One of the hardest things to do in design is to create custom typography. There are a lot of pieces that need to come into consideration and it takes a lot of talent to do it right. Having recently started to develop my own typographic skills, I was starting to get a little cocky. In those prolific moments when I find that I am starting to lose my humility I usually find that browsing Behance is a nice cure. It was there that I stumbled across these brilliant examples of typography and I figured I’d share them with you in case you hadn’t seen them. Click the images to see the whole presentations. Also, be sure to check out the rest of their behance profiles because I’ve really only scratched the surface as far as what these talented designers have to offer.

Tube by Julian Hrankov

Ajeva by Julian Hrankov

Forza by Cris Labno

Badona Typeface by Oguzhan Ocalan

Practicum by Lapin Design

Armenian Foods by Haik Avanian

Design Works by Jesse Kaczmarek

Koenig Architektur by Muggie Ramadani

Well there you have it. I think that much can be learned by merely observing and studying the brilliance of others and I think that this group of designers did a wonderful job of teaching. Not have they taken me down a peg or two, they have managed to make me extremely jealous and to inspire me – a rare thing.

Designer Credits: Cris Labno, Julian Hrankov, Oguzhan Ocalan, Muggie Ramadani, Jesse Kaczmarek, Lapin Design, Haik Avanian

Smart Layouts with PHP and HTML in Web Design

Jared Lunde — Tue, 24 Nov 2009 00:13:25 +0000

Difficulty level: Novice

Honestly anyone with knowledge of HTML can do this and trust me it will save you loads of time in the long run. The main idea behind this structure is that anything that is going to be on more than one page in your website is going to be called through a php include. The reasoning behind it is that if you ever plan on updating the design or structure of your site, you’ll be able to do so much quicker through this method because instead of updating each page individually, you’ll only have to update one file. It is also a wonderful solution because of how clean your markup will look.

The first thing we want to do is map out the areas that we are going to be using on every page on our site. Let’s start with the information between our tags.

– include name: “head-constants.php”
Likely culprits in this section include your content type, favicon, stylesheets, javascript and possibly RSS feeds:

Next let’s think about the of our document. Since I like to keep similar page structure on all of my sites for easier user navigation, I’m going to include a file that has the tag within it. This file will be required directly after the tag.

– include name: “body-top.php”

Now that I have my main page structure set in body-top.php, I’ll want to include a file within body-top.php that takes care of the header portion of my website.

Header & Navigation – include name: “header.php”
Within header.php, we’ll keep our markup for our logo, navigation, search bar, etc. Anything that will be in the header of every page on your site.

If you have a sidebar that is constant on your entire site, it’d be a good idea to include that as well, but for the sake of length I’m only going to include a footer in this example.

Footer – include name: “footer.php”
The footer is where we will close our body, html and set structure tags. You may also want to include a footer navigation or copyright information in this file as we did with header.php.

So what does this look like when it is all pieced together into a document?
Hello World!

Here is the rest of our body content.

It’s looks clean and pretty doesn’t it? What’s great is that we can now spend 10 minutes updating all of our pages instead of 10 hours or having to deal with the horror of a massive find/replace.

Web Designer Depot – Part 1

Jared Lunde — Fri, 20 Nov 2009 05:56:18 +0000

This is part one of a mini-series of blog posts that I will be referring to as “The Flaws and Delusions of Web Designer Depot”

I don’t get particular enjoyment out of pointing out the flaws in others, but in this case it is so worth it. For over a year, WebDesignerDepot (Web Designer Depot) has been handing out terrible advice and ripped off posts to its users. Their articles lack attention to detail, sense, and quality of any kind.

Perhaps the funniest post I read of theirs was one that they did on “Coding for Speed and Quality”. I say it is funny because if they can’t even control the speed at which their own website loads and is presented (it is slow and looks like someone threw up on the header – also lacks any navigation whatsoever) why in the world are they writing an article about it? The site (uncached) weighs an incredible 1642.3KB, with a cached weight of 118.3K and all the while making an unprecendented 160 HTTP requests. The entire site took an astonishing between 22 and 29 seconds for me to load uncached and between 14 to 20 seconds cached. Maybe I’m nitpicking, but if I’m not on a 56K modem and a site is taking that long for me to load, someone is doing something very very wrong.

The worst part of all of this is that the Web Designer Depot actually has people who drink their kool-aid on a regular basis. Their following is over 85,000 on twitter and they sport a cool 4,500 Alexa ranking. You get what you pay for I guess. At least I assume that’s how they did it – paying users at digg to get their articles to the front page. There is no other possible way that intelligent beings would ever digg or distribute their drivel. I suppose it’s easy from there, you’ve got your name in the ring and you become a hobby for beginner and know-nothing web designers and developers who are now doomed for eternity (or at least until they find a better blog).

Brand Name Generator

Jared Lunde — Mon, 16 Nov 2009 08:36:00 +0000

We are all well aware of how hard a lot of Brandstackers work when coming up with their clever, witty and absolutely original ideas. Well life just got a little easier for them and all of us! I present unto you the Brandstack Brand Name Generator. Now you don’t have to use your brain to come up with neat brand name ideas, a fresh idea is one click away!

How do I use it? It’s simple! Simply visit the link above and press the “Lay it on me baby!” button. That’s it. Don’t like it? Click it again and presto change-o you’ve got a new one! Careful, though, some may already be in use! Wouldn’t that be a drag.

Minima Logo Design – Explained

Jared Lunde — Sun, 15 Nov 2009 02:32:21 +0000

Minima is my under construction Logo Design Portfolio where I will showcase the design elements of my job in a more in depth and creative way than is possible on this site.

The most important thing with the minima logo was to communicate the name in the most appropriate (minimal) way, while still producing something that was unique and memorable. I knew right away that I wanted to do a custom logotype. Here is a grid representation of the logo:

I like using grid representations in this manner because it really helps you see minute details or inaccuracies you might not see with the naked eye. As you can see, by using a lowercase “a” instead of an uppercase “A” the logo is much more cohesive and the whitespace is more consistent throughout. Not only does the lowercase “a” balance the logo better, it also made the logo a touch more unique.

My inspiration for the style of “a” that I used was Chalet Paris 1960 which actually showcases my favorite “a” in typography. Here are side by side comparisons between the minima “a” and the Chalet Paris 1960.

The major similarities between the two reside in the bowl where the curves are nearly spot on. The only in your face difference is in the spur where I decided to keep it straight to maintain consistency in the type. There are maybe more similar “a’s” out there, but like I said, Chalet’s was where I drew my inspiration from.

The end result of this logo ended up being everything that I wanted it to be. It is simple, memorable, minimal.

American Cancer Society – Client Testimonial

Jared Lunde — Fri, 13 Nov 2009 06:02:17 +0000

“I could ramble on about how talented Jared Lunde is at programming and design, but like any other artist or dedicated professional, I believe it is best to let his work speak for itself. After engaging with Jared and similar vendors on countless large projects, however, I can honestly say there is one thing that truly… absolutely… unequivocally set him apart from the rest: the process. In a business environment in which your success is becoming more and more interdependent with the success of outside vendors, I wholeheartedly felt Jared took the time to understand my needs and my goals which he then translated into the final product. He gave me a powerful level of confidence in his abilities that eventually developed into an incredibly trusting customer-client relationship.”

Frank O’Driscoll
E-Revenue Project Manager
American Cancer Society
Eastern Division, Inc.

How I Design a Logo

Jared Lunde — Tue, 10 Nov 2009 10:07:24 +0000

There is no such thing as a How To or DIY guide when it comes to logo design
Having been in the field now for a while, I’ve read a lot of opinions and guides on logo design. Do this, don’t do this, you need to have this. For the most part, it is all rubbish. As disappointing as it is to hear or say, some people just do not have it. You can practice every day, create *logos* for a million businesses and still have absolutely no idea what you are doing. I don’t think there are any specific guidelines, but I do feel there are basic principles. I also think that every designer needs their own process and their own comfort zone. So instead of going through a bunch of steps telling you what you need to do to make a good logo I decided that I would share my own experience in design.

How I design a logo
The most important part of designing a logo for me is learning about the business I am designing for. As hard as it is to do sometimes, I try to pull out every ounce of information I can about a person or establishment and typically the ones who are able to give the most information about their target, their service, their competitors and what makes them unique are the ones who end up receiving the best quality of work.

Businesses are like people – no matter how similar they may appear, you can bet there are a lot of differences. I’ve never had to two clients in the same industry describe their business exactly the same. My goal is to make that business’s logo reflect its persona, its personality and to make it speak to its target. If I am designing a logo for a construction company, what kind of construction do they do? What sizes of budgets do they work with? Who are their typical clientele? If I’m designing a logo for a construction company that typically constructs low-income housing, you can bet their logo is going to be miles apart from one that constructs office buildings downtown.

Now that I know more about who I am working with, I start to get ideas flowing. I am an atypical logo designer in that I do not like to sketch my ideas out on paper. I have an innate ability to piece things together in my head and actually can see things more in my mind than my hand is even able to draw. A great thing about designing from the head, too is that if you have a good idea you are going to remember it. If you can remember an idea you had 3 hours earlier while you were at the grocery store and you are able to construct it in Adobe Illustrator when you get home, it’s a good sign that you are perceiving a good logo. Why? Because memorability is the most important thing about logo design. If I don’t remember the idea I was having it is either because it was too complex or just wrong. Call me crazy, but I firmly believe that sketching is a detriment to my design process.

Communication through design
Another important thing that plays into the memorability in a logo design how well it communicates with the business it represents. Not only do we want a consumer to remember the *face* of the design, we want them to remember the whole package that it represents. This is not completely reliant on the logo design itself, a lot has to do with additional branding such as advertisement design, but that’s why we need to make a strong, brandable logo. We need something we can build a body around. A logo isn’t going to be very memorable if we can’t put it on anything or if it gets lost in the mix of an advertisement. It should be able to stand up to the design or image around it.

How can you use this information?
If you are planning on hiring a designer, well… hire me because I can get the job done right . If you don’t hire me, hire another professional with a strong portfolio and a solid client list. Do not crowdsource your logo or have a logo designed in a hurried manner, have it done by someone who wants to learn about you and about your business and is willing to spend the time necessary to do so. You should also be willing to pay a reasonable amount of money for your design even if funds are tight. Logo design is not done in a day and does not require only a day’s wage. If you hire a designer to do your logo, they may end up offering better deals on things like websites, stationery and advertisement designs since they are already quite familiar with your business and your branding direction.

If you are a young designer trying to better yourself, I encourage you to figure out what process works for you and to study other successful brands in the marketplace to get a better idea of what has worked for different industries. I also encourage you to learn from people who have experience in design and are way better at it than you are. Watch a Paul Rand interview, for instance. See what made his head work. My favorite course in college was a History of Graphic Design course and it was invaluable to see what others had done before me.

Take this for what it is
This is just my opinion on a very subjective matter. It is sort of my stream of consciousness and since my mind is always moving, somethings may have been a little unclear or incomplete and if you would like to hear more or get clarification, feel free to comment. As always, if you can prove me wrong or you disagree about something, I would love to hear about it and I encourage you to share it with others.