Archive for the ‘Career’ Category

What Does it Take to Be a Mobile Designer Today?

Tuesday, June 17th, 2014

Mobile is here to stay, with its own set of rules and constraints. At the same time, it’s a rapidly evolving platform, with new technologies and capabilities being added by the quarter. We can’t design for mobile like we used to do for posters and Web pages. So what toolkit and mindset does a mobile designer need to thrive?

Challenges and Constraints

Every medium has its limitations. Even mobile—one of the richest canvases a designer can dream of—still has particularities that need to be addressed:

Device fragmentation

There are countless smartphone and tablet models out there, each one with a different screen size, pixel density, and physical input (not to mention screen orientations). This means we can’t just pre-assume an iPhone 5 screen-size and design tightly to it. In mobile Web, responsive design allows us to plan for variations and make the design adjust to different screens with little effort. In native mobile design there is less liquidity, so we need to think our designs as tolerant to screen differences, and document the way such variations impact the layout.

OS fragmentation

As of today, we have three major mobile operating systems to consider: Android, iOS, and Windows Phone, in order of usage. Every OS has its own set of interface patterns, external inputs, and guidelines, not to mention variations between OS versions as well. Within Android things are even more complex: the version of Android a device will use is going to be influenced by the device maker, which can overlay its own layer of UI on top of it, and the device itself and its processing capabilities (not to mention the upgrade delays imposed by some carrier companies).

Even if this fragmentation does not make the design vary too much, it does influence how users experience an OS and what they expect from it. Consider, for example, that the experience of Android that most users have is actually the TouchWiz or Sense interfaces.

Performance

The way an app is designed can influence the amount of energy it uses. To put in other words, our design can leave our users without battery juice. Certain unnecessary visual effects or animations may need intensive graphic processing to run; a JavaScript-intensive Web page can also use a lot of power. And while our newly purchased device may be running our app smoothly, a 2-year old device may be struggling with it. These are just examples to illustrate the idea that a mobile designer needs to understand the impact that their decisions have in how an app performs and uses the device’s resources.

Development and cost constraints

Just because we saw it in that cool new app the other day doesn’t mean that it can be easily implemented. The way we design an app can make the difference between meeting and missing a deadline. If we don’t clearly understand the cost of the design decisions we make, we are basically putting the burden on the developers and creating an opportunity for friction later on.

Things to Unlearn

Many of us have been trained as designers in an era where a digital mindset was still incipient. That has historically caused us to approach digital design from a static point of view (exporting HTML directly from Fireworks, anyone?), and the misalignments that result from this perspective are still being taught in design schools. With mobile design the gap is even wider, as mobile brings a language for which nearly all of our current tools and methods fall short. So it’s time to update our mindset.

Mobile is not a canvas

HTML isn’t a canvas either. You can’t just throw things at it like you’re designing a poster. I suspect that designing in Photoshop is not helping us in making the switch, because we have been using it to design posters and illustrations and retouch photos for more than two decades. We’re still “painting” our interfaces, when screen size fragmentation and the dynamic nature of mobile call for a different approach to design.

Stop thinking of screens and start thinking of transitions

We are just starting to realize that the “screens” approach doesn’t cut it when it comes to mobile design. Thanks to apps like Facebook Paper or Yahoo! Weather that showcase a different way of designing, we know we need to design based on transitions rather than still images.

Transitions, once just disposable eye-candy, are becoming the center of a mobile experience. They not only give a live, interactive tone to the interface: they are an interface element in their own right. Transitions convey movement, space, change, and hierarchy and are a great ally in communicating the underlying app structure to the user. They also render a static approach useless.

Put your designer ego aside

You don’t need to be unique or original, especially when being “unique” means redesigning a known interface pattern just for the sake of uniqueness. More often than not, sticking to native UI elements and patterns is the smartest move to get the app completed on time. Rather than pushing your designed-from-scratch set of UI controls, focus on creating a simple, effective interface and create branding that shines.

For inspiration, real apps are better than designer portfolio sites

Many designers go to the likes of Behance or Dribbble in search for inspiration for their next mobile project. While you will always find beautifully crafted artwork on such sites, if you are not a seasoned mobile designer, those mockups can be misleading. Many of them are just that—mockups that have never met reality, and they can bias your judgment toward believing that you must create an entirely customized UI every time.

Get inspired by real, successful apps. There you’ll find the designs that have made products thrive. Their interface patterns have been tried and tested in the real world, and you know for sure they can be replicated.

New Skills to Learn

Know the platform

Just as you need to understand HTML/CSS to be a good Web designer, you need to understand the underlying structure of mobile apps too, and they are totally different from Web pages. For instance, they don’t “flow” the content as HTML/CSS do, and that changes a lot the way we should think about the layout. You won’t have the magic of CSS inheritance (at least not nearly as polished and not out of the box) to separate markup from presentation. Oh, I almost forgot: there’s no “markup” either.

You will need to get into some documentation for developers, read the manuals and understand how mobile apps are assembled, compiled, and published. Understand how a mobile device works and which things drain the battery the most. You may even need to learn some code basics, which pays off in the long run: you’ll be able to learn the developer’s language and you will design with efficiency and feasibility in mind.

Know the nuts and bolts of mobile technologies

Here’s a laundry list to get you started: location services (Wi-Fi- and GPS-based), Bluetooth, Low-Energy Bluetooth, beacons, front and rear camera, microphone, gyroscope, accelerometer, vibrator, fingerprint scanner, eye tracking, voice recognition, face recognition, tap detection, and the list goes on and on. Every new technology opens the doors to a whole new breed of apps. Your responsibility as a designer is to be aware of the cutting-edge.

Discover how far you can get with native components

Native UI components actually give lots of freedom to customization efforts, but you need to know exactly how to use them. If you can do most of your UI with native controls with a few tweaks, you’ll save a great deal of the developer’s time, which they will be thankful for.

Know the mobile workflow

Learn about mobile SDKs, install them and get them to run. Learn about mobile frameworks, such as RubyMotion, Xamarin, or Titanium. Get familiar with IDEs, where the graphic assets are located within a mobile project, how they should be named, etc.

Learn mobile interface patterns

All three major mobile platforms have similarities and profound differences on how they understand mobile interaction design. Their users expect different things from them. As a mobile designer, you should be completely aware of these differences and able to detect them on the spot.

Don’t stick with a single mobile platform. Try all three, or at least use Android and iOS on a daily basis for at least 6 months each. I did it, and it’s great—you get insights from each platform you’ll never get with casual use or looking at screenshots. And switching is good: being a fanboy is bad for a mobile designer.

Document and explain your UI

Since screens don’t tell the whole story anymore, you will have to document different states, transitions, and animations as well as how the app reacts to data and to the environment. Annotate your mockups, provide animation examples, and plan for device orientation.

Embrace Lean UX in the design phase

A modern designer should be a strategic designer. So your goal, rather than just come up with something beautiful, is to infuse into the design everything the team has learned about the product. Prioritize rapid prototyping in order to get early insights of what the users want. Save the detailed artistic work for later. Ensure that everything that is designed is aligned with the core value proposal and with the users’ needs.

Embrace Agile UX when implementing

You can’t just hand your mockups to the developer and forget about it, as most of the graphic requirements will arise when developing. There will be always screens not previously considered, new transitions and state changes that require new graphic assets. You need to be there and respond in real-time. So bring your chair next to the developers and be ready to step into the design when needed. Make sure that the developers only have their mind in development and that they don’t have to make UX decisions to fill your gaps.

Some Extra Tips for Mobile Web

Be responsible with responsive

For mobile Web, responsive design is not the one-size-fits-all solution. In some cases it makes sense, in others it doesn’t. It’s your responsibility to know where mobile demands a dedicated solution and where a few responsive tweaks are enough to maintain a single code base. Even if you are designing for “traditional” Web, plan your layout so it adapts gracefully to different screen sizes. And mind asset sizes: that nice full-screen 1Mb background image can make your mobile visitors waste money in cellular data consumption.

Use CSS and JS candy with caution

Yes, CSS animations, gradients, transitions, and shadows are great and incredibly easy to implement. And parallax is neat, plus all the cool guys do it, right? But these elements can take a toll on a mobile device battery. The more “live” visual effects you pile up, the more sluggish the scrolling will feel and the more power it will consume.

Even innocent CSS3 selectors can impact performance on low-end devices. Prefer ID’s and classes when possible, and try to keep your descendant selectors low. So if you can go with #submit instead of .main .container .form > div .submit, it’s a good idea.

Use the Right Tools for the Job

This is not at all a definitive list, and you will find great alternatives for many of them, but these are some good tools suited for mobile design (some of them are free, most of them are Mac-only):

Sketch for graphic design and @2x hi-resolution export. This is arguably the heir of the now discontinued Adobe Fireworks, and it has been done with mobile in mind.

LiveView and Sketch Mirror (a companion for Sketch) for mirroring your screen to your phone. Things look and feel very differently in a device. You’ll be able to easily test the size of interaction areas and controls.

Origami (by Facebook) and Quartz Composer for mobile interaction and animation prototyping. This is the closest you can get to a native UI prototyping without coding, and will give you a good introduction of the kind of logical thinking that programmers use.

PaintCode for creating UIs and graphics and exporting them directly to Objective-C.

Mockup web software. There’re plenty: Balsamiq Mockups, Axure, UXPin, Moqups, Proto.io, just to name a few.

Flinto for creating mobile interactive mockups that can be installed in your iPhone, mimicking real apps (taking advantage of Safari’s Add to Home Screen feature).

ImageOptim for compressing your PNG and JPG files without loss of quality.

Version-control software, preferably Git or Mercurial. Commit your assets and changes directly to the repository and in real time, rather than e-mailing a ZIP to the developer.

All of this is Already Obsolete

Not really, but the pace of progress in mobile technology is incredibly rapid. In no time we will be faced with the challenge of designing for wearables, smart appliances, and sensors connected to our mobile apps. New challenges and innovations come out daily. So, if anything, being dynamic, flexible, and ever-curious as a designer is what will ensure you grab a seat in this roller coaster.

This article originally published at UX Magazine here.

3 Rules for Creating a Beautiful Online Portfolio

Thursday, June 12th, 2014

If you’re a creative professional—a designer, photographer, writer, or advertising exec—you’ll likely need to show an online portfolio as part of the application process for any job.

But no matter what field you’re in, having a permanent link where people can access your work has other benefits, too. It’s standard practice these days for recruiters to Google candidates’ names to see what they can dig up—and when they do? Having a website that shows off the articles you’ve written, campaigns you’ve been part of, or other past work you’re particularly proud of is a very, very good thing.

In addition, an online portfolio allows you to easily collect all of your clips or work samples in one spot. When you need to pull together materials to showcase in an interview, you’ll be happy that everything is available and up-to-date. I’ve found my collection of clips that I keep on Tumblr to be a great way for others to see my latest articles all in one place and for me to assess the trends and topics that I cover best.

Of course, before you start throwing things up on a website, you’ll want to make sure that this micro-homepage is visually attractive and dynamic. There are plenty of platforms you can use (Cargo, DripBook, Krop, and Carbonmade are some of the best) but no matter which you choose, here are some tips to make sure that you convey the right message.

1. Get to the Point

Recruiters will usually make their hiring decision within the first minute of meeting you, and that same rule should apply for your online portfolio. From the second someone arrives on your page, you have to make sure he or she gets the best, most effective impression of you.

Besides having a clean, professional design, one of the easiest ways to do this is to have a single, compelling image to greet people at the top of your page. Even if you’re not adept at shooting a camera yourself, you can use a stock photo that will represent you well. Just make sure that your selection matches the industry in which you’re competing—for instance, if you’re a PR professional, you’ll want an image that shows activity and connectivity; if you’re a writer, something that uses words, letters, or writing tools.

No matter the industry, check out Curalate’s infographic for guidelines on which types of images work best: Images that are reddish-orange, for example, do better than images that are blue, and photos without people in them are shown to be more compelling.

2. Keep it Simple

During the interview process, you will have plenty of time to talk about your best projects and greatest achievements. On your online portfolio, though, you just want to whet people’s appetites. Think of it like an auction—you get to see the item in a catalog and fall in love with it beforehand. Then, during the live portion of the event, the auctioneer will give you more info about the object up for sale.

Sell yourself in this same way by telling the story with less on your portfolio. For example, include the front page of the brochure that you designed and created—not all 16 pages—or links to your top 10 articles, not top 100. Wait for a prospective employer to request the rest. It’s a good sign. And once someone is interested in your work, you will have plenty of time to give him or her more information.

3. Give Your Interviewers What They Want to See

Found the perfect job to apply to? Great. Don’t be afraid to adapt and adjust your portfolio from time to time, especially if you’re interviewing for a specific position.

Pay particular attention to the skills advertised in the job description, then use that information to help guide you on what to put front and center on your portfolio. For instance, if you’re interviewing with a healthcare company, make sure the work you’ve done for other healthcare clients is easily accessible—more so than say, your fashion, sports, and media work. It’ll be comforting for the interviewers to see your relevant experience in action, and it could even help them carve out their vision for what they want for theirs.

Like your resume, your cover letter, or anything else in your job hunt, your online portfolio should showcase what you have to offer in a concise, compelling, and interesting way. Keep these rules in mind, and you’re already one step ahead.

This article originally published at The Muse here

How to Find an “In” at Your Dream Company—Fast

Tuesday, May 13th, 2014

You’ve heard the reports. Employers today are leaning more heavily than ever on their own employees to help them find and recruit exceptional talent. Why? Because in many instances, it’s faster, cheaper and, at least in theory, more likely to result in a hire who excels in the job and aligns well with the culture of the hiring company.

This is promising and cool news for those among us who seem to know everyone and aren’t afraid to ask our people to serve as an “in” for a dream job. But what about those of us who don’t know many people? Who are moving to a new city, changing careers, or just, well, aren’t dazzling extroverts?

How do you get in that pool of people who, in all likelihood, will be considered first, instead of having to tromp your way in with the herd of others via an online application?

Strap on your gumption, folks, we’re about to get down with a little networking here. You want to be in the “in” club? Well, then, you’ve got show up for the game. You’ve got to find someone at that company you adore, and quickly (and non-offensively) endear yourself to him or her.

Here are six steps to cultivating your “in” at a company of interest.

Step 1: Race Over to the Search Box on LinkedIn

We have no better tool available to us to help us find people working for the very companies we’d like to join than LinkedIn. So, take advantage of it!

Key the company of interest’s name into the search box and, when the results come up, refine the search by checking the box that only shows you people currently working at that company.

If you have a 1st degree connection, you’re in business. Contact your person and ask for an introduction. (Here’s how.)

Step 2: Assuming You Don’t Have a 1st Degree Connection, Try For a 2nd

If you don’t have a 1st degree connection, that’s OK: Your 2nd degree connections can be equally valuable. When you discover that you’ve got a 2nd degree connection to someone working at your dream company, simply contact you shared connection (your 1st degree connection), ask him how well he knows this person, and see if he’d be willing to introduce you. (And here’s how you do that!)

Step 3: If You Don’t Have a 2nd Degree Connection, Try for a Group Connection

This is a magical way to get in touch with people you’ve not yet met. If you have no 1st or 2nd degree connections, find someone working for the company of interest, preferably someone who appears to work in the same department (would-be peers are excellent choices for this approach). Now, scroll to the bottom of her profile and check out her Groups. If you are already both members of a Group, terrific. If not, join one of the same Groups she’s in.

Why? Because when you share a Group affiliation through LinkedIn, you can contact fellow members directly.

Step 4: Approach Like an Affable, Genuine, and Sane Person

You’ve got your in. Now, how do you approach? Like a human, that’s how. Like a human who is not ambushing another human.

When you have the 2nd degree connection, try something like this:

Hi Joel. Thanks so much for taking the time to chat. I’d really just love to ask a couple of quick questions about your experience working with XYZ Company.

When you have only the shared Group affiliation, consider something more like this:

Hi Sherri. You and I are both members of the Geek Austin Group here on LinkedIn. [Writer’s note: That’s a real thing.] I notice that you work for Yodle. I absolutely love Yodle—may I ask you two very quick questions about your experience working there?

In short—approach in a way that doesn’t make the person feel like you’re asking for the moon or any weirdly forward favors. You don’t know this person yet. You need to build rapport.

Step 5: Keep the Banter Going for a Bit

Your goal in this stage is to continue building rapport and help the person become familiar with you. It’s the chit-chat stage of this process. It doesn’t have to last forever, but a little back and forth about the company, what you both do, your shared interests, and so on will likely go a long way when it comes to having someone vouch for you.

Step 6: Go in for the “Ask”

After you’ve achieved a bit of banter, now (and only now) is the time to ask for the “in.” One way to go about this:

Thanks so much, Sherri. It’s been great talking with you. Hey, I noticed that Yodle is looking for a client services manager. Would you happen to know the person I should talk with to get some additional information on this position?

Assuming Sherri knows, you end this conversation and go right to that contact, letting her know you’ve just spoken with Sherri. And, voilà!

You have an “in.”

And that’s what you want to go for. Every single time.

Article originally published at The Daily Muse here.

How to Create an Effective App Demo Video

Friday, February 7th, 2014

You’ve built a great app that you are sure will have a large audience. The next question is how do you get the word out – you know, market it. Many app developer are turning to demo videos to entice potential users to check it out and from there hopefully download it.

So what are some elements that lead to a successful demo video? According to this article in DevsBuildIt by Sean Casto, CEO of Alliance member PreApps, here are a few tips:

  • Choose your tools carefully
  • Don’t shy away from creativity
  • Harness the power with a strong voice
  • Keep it to the point
  • Hook the viewers

Please share links to any great demo videos you have seen.

Cogswell Student Interns as Graphic Designer for Tampa Bay Buccaneers

Tuesday, February 4th, 2014

Aston with his Merceds Benz poster design.

Aston Majors knew he wanted to complete an internship before he left college but had no idea it would lead to such an exciting opportunity. In his wildest dreams he hadn’t imagined interning for the Tampa Bay Buccaneers.

“I found a site called TeamWork Online that all of the major professional sports teams use to recruit staff,” said Majors, “and signed up. I saw on the job board that the Buc’s needed a graphic design intern and applied.”

The Buc’s called, interviewed him, reviewed his work and Aston was on his way to Tampa Bay. Though it was not a paid position, he feels that what he learned on the job will pay big dividends in the future. In fact, his supervisor at the Buc’s asked him to stay in touch and the Banana Republic offered him a graphic design job but Aston said he has to finish school first.

Aston spent the Fall term doing his internship, working full-time with the Marketing Department and tackling a variety of design projects.

“I got to go to meetings and present my work,” said Majors. “It was a great learning experience and I found out I really liked the process. My advice to all students – don’t leave school until you have done an internship. It will make a big difference in your career and you will make a lot of connections.”

Aston will graduate this summer in Digital Art & Animation with a concentration in Entertainment Design.

It Can Be Lonely at the Top if You Go It Alone

Friday, January 31st, 2014

Planning to launch your company as a solo act? Some seasoned entrepreneurs will tell you that launching a business without a partner is like the kiss of death but this article in Inc. Magazine by Elaine Pofeldt, says not necessarily.

While going it alone may not be the fatal mistake that some industry analysts think, there are certain issues you should consider.

-Loneliness: The solution – “get up from the desk once in a while. Go to industry conferences and attend local meetups with other entrepreneurs.”

-Myopia: The solution – “setting up an active advisory board of startup veterans can help you avoid that trap.”

Why or why not would you choose to run your business by yourself?

Most overused Profile Buzzwords on Linkedin

Friday, January 24th, 2014

Are any of these in your Linkedin profile?

Putting together your Linkedin profile and want some tips on putting your best foot forward? Then check out this article from the Linkedin blog about best practices and avoiding the ‘buzzwords’ that everyone else is using.

For the past four years Linkedin has conducted a survey of words members use to describe themselves and which words appear most frequently.

Which of these words are in your Linkedin profile? What do you plan to replace them with?

One Game Programmer’s Journey

Monday, January 13th, 2014

Tommy Refenes remembers his days as an aspiring video game designer and the myriad of questions he had about how to get started. Following a particularly inspirational presentation, he wrote the featured game designer a long email filled with his thoughts and questions. Sadly he never heard back from the designer.

Through trial and error he eventually learned his craft and in May 2006 Tommy founded PillowFort and created “Goo!.” The game earned an IGF Technical Excellence nomination, grand prize in the 2008 Intel Game Demo contest for Best Threaded Game and finished 3rd for Best Game on Intel Graphics. He is best known for “Super Meat Boy.”

Now he is in the position of master game maker and the recipient of those ‘how-to’ questions. He says that the two most asked questions are, ‘How do I get started?’ and ‘What programming language should I use?’ In this article in Gamasutra, he attempts to answer these and other questions.

  • Everything starts out at the very most basic level and builds up from there. Breaking your game down into small pieces forces you to analyze and evaluate your ideas on a deeper level.
  • When it comes to programming languages he suggests that you stick to what you know, or go the easiest most comfortable route possible to acquiring skills to start work on your game. So if you know a little Flash, use Flash, if you use C++, use C++, if you only use Java, then use Java.
  • The article also covers using books and tutorials as learning aids, what software he has used, how he stays motivated during the development process, steps to get your game on various platforms and how to deal with a lack of audience interest in the game you build.

Send us your questions about how to get started as a game programmer or visit our website to learn more about earning a BS in Game Design Engineering.

Effective Workflow Tactics for Remote Clients and Collaborators

Thursday, January 9th, 2014

Working on a remote team to complete a project is now the norm rather than the exception. In this article in Designing Sound contributed by Michael Schiciano of Skitch Studio, he shares his insights into working collaboratively and how to avoid some of the logistical challenges that can crop up.

Points covered in the article include:

  • Establishing the Vision and Scope of the Project; Whenever I had issues coming up with ideas in the middle of a project, a very likely culprit was simply not doing enough communication early enough in the project.
  • Detours and Changes; Sometimes these are messaged down from a client.  Other times they are discovered as part of the work itself.
  • Getting the Names Right; Another area you’ll want to make sure gets addressed during the middle of a production are the simpler, smaller details of effective naming conventions.
  • Making the Delivery; The final stages of a project will bring forth another wave of heavy communication, most notably focusing on the details of the submission process.

If you have collaborated on a project remotely, what did you learn in the process?

So you Want to Start a Software Company?

Friday, January 3rd, 2014

If this is your dream, you are not alone. As witnessed in here in Silicon Valley and around the globe – the opportunities opened up by mobile apps have made this a popular choice for setting off on your own. This article in Computing Now contains important information to help you start off on the right foot.

Some of the issues covered include:

  • Your most important asset – people
  • Founders don’t see the world the same way as employees
  • It’s ‘our standard contract’ is rarely true
  • Find out what people need, make it, tell them and get them to pay you

What other issues would you like to see discussed about starting a software company?