Online Identities

As a designer, branding and promoting yourself is just as important as promoting the work you create. There’s cutthroat competition out there, and you have to make yourself stand out from the crowd at first glance. You have to be able to clearly and quickly communicate what you do and catch people’s attention to make them want to know more. You’re basically selling yourself…in a professional manner. Designers create identities for themselves that represent their personal style and their work. These identities are translated into marketing tools, such as portfolio websites, in order to form a cohesive and memorable brand.

As a student, I’m currently in the process of discovering my own brand personality. It’s hard because I want to be as versatile as possible, but I need to showcase my strengths and focus in on what type of personality I want to portray. Many of my projects thus far are very colorful, friendly, and fun. I think that I want to create a portfolio website that is clean and simplistic to offset this and make the work stand out. When doing research, I came across a few examples of strong personal brands along the lines of what I envision for myself that I can pull inspiration from.

pf-17

Jessica Hische has a very simple and clean portfolio website that showcases her work. She picked neutral tones and added a pop of color with the orange that makes little things stand out. I like that her logo is playing off of a bookmark because when you bookmark a spot, you want to remember it. The female silhouette inside is a nice personal touch that makes it memorable. It’s simple, yet it’s really clever.

pf-31

Adams Creation is a small company specializing in “advertising design and media services,” which they make very clear at the top of their website. I enjoy the name-play of Adams Creation, like the Creation of Adam, whether that was intentional or not. As you scroll through the page, the navigation bar stays fixed at the top and the logo turns into a simple ” a’ ” icon. Again, I love the simplicity of that branding and that they always make sure you know who’s work you’re looking at.

simple_portfolio

And then there’s always the option of being very image based and letting the work speak for itself initially like on the Peachey Photography website. The photographs on this portfolio are what capture your attention. Then as you hover over them you notice they are links and you can click for more information or for galleries. I also like how this logo almost becomes a stamp, which can be really strong for branding because it could be on anything from packaging to business cards to the watermark on the photos. It’s clean, simple and versatile.

I’m not exactly sure yet what direction my personal branding will go in, but I know right now that I want it to be simple. I will probably experiment with a few different ideas before settling with the one I like best, as a designer should do. I think the hardest part for me will be sticking to the simplicity that I want and coming up with a successful logo and brand that can hopefully be timeless. Minimalism is sometimes more difficult, but when you find the right solution, it really works.

Responsive and Mobile Web Design: The Basic Do’s and Don’ts

Responsive web design is when a website is created with the ability to adapt and translate to multiple different sizes and viewing devices. With so many different web browsing technologies and devices available, responsive design is becoming necessary in order to provide an optimal experience for each of the users. Even Stevenson University recently redesigned their website to provide a responsive layout. Some websites, such as Facebook, have a separate URLs for their desktop sites and their mobile sites (usually with an “m” in front). A responsive website would avoid this problem, because a single URL would adapt to each individual device. A successful responsive website is accessible and understandable no matter what device it is being viewed from, whether it’s from desktops all the way down to mobile phones, and who knows where the future will take it.

With it being so versatile in it’s usage, there are many factors to take into consideration when designing for the responsive and mobile web. It’s not just about making the content conform to a smaller view-port. You have to maintain a strong user experience across multiple different browser types, and still make it cohesive as a whole. In order to do this, as found on resources such as Alchemy Interactive and Le Site, there are do’s and don’ts of responsive web design:

DO consider the user when designing. You have to pay attention to all the possible devices they could be using and know what their purpose is in visiting your site.

DO design for each specific device, since they are all unique form each other and have different features and capabilities. Like Alchemy Interactive says, “one size does not fit all.” In this example, you can see how the website All For Color is displayed differently on the mobile phone than on the desktop monitor. The designs are different because the unique characteristics of each device and screen was taken into account.all-for-color

DO change how you present the information on each device to make it clear and understandable.

DO use a fluid grid structure when designing so you can easily adapt for each view-port.

DO pay attention to what is visible “above the fold” on each device. Make sure it gets enough information across.

DO limit the number of pages, images, custom text, and anything else that will slow the page loading time when adapting the design for smaller devices such as mobile phones and tablets. Ask yourself what is necessary so you don’t clutter the page with anything that’s not.

The key word here is ADAPT. Designs have to be flexible in order to reach as many users as possible on all the different devices they may be utilizing.

Now that you know some things to consider, here are some things to avoid.

DON’T use the same strategies you apply to non-responsive design. This is a different concept and not everything should be fixed in one place.

DON’T punish users for the device they are using by not keeping them in mind when designing. Consider as many possibilities as you can think of, because it is guaranteed that someone is using it.

DON’T hide or hold back content from mobile users. You can alter it if necessary, but make sure everything is still accessible.

DON’T have a big file size that makes the page take too long to load. Most people will abandon a mobile webpage after 5 second if it doesn’t load.

These are a couple major things to consider when designing responsively for the web, but of course there are more details that are sure to come about as your page develops. As designers, it is important that we provide as solid of a user experience for mobile web users as we do for desktop or laptop web users. Some good resources to look at that provide important aspects of good mobile experiences are Mobile Web Best Practices and Visual.ly. Examples of important factors in mobile design include clarity, keeping forms short, limiting images and keeping them small, and being aware of font choices. Overall, things should be kept simple and straightforward. Everything from gestures to navigation to content should be made obvious for ease of use.

Design matters and when you keep the user in mind and deliver a pleasing, adaptable website that sends the same message across all browsers, it should make people return—on any device.