How to design a good logo?

There are many ways to design a good logo, but we are sharing some important points which will be helpful in designing logos.
First let understand what is logo?

In simple terms logo identifies a business in its simplest form via the use of a mark and icon. 
“Justcreative.com”

1. Start with design brief & research?

After getting the brief by preparing questionnaire or interview with client always start with research.
- Get the full information about the companies’ history.
- Understand the companies name and type of product they are producing.
- What is their mission and vision?
- Who are the competitors of the company?
- What is their current market position?
- What is the current trend in the market related to design?
- Always ask the constraints to the client related to color because some clients have their establish color in the market.
- Know each and every detail which is required to design a good logo.

The benefit of the research is that you will get clear picture what is the expectation of client also it will help in designing the appropriate logo design according to market and competitor.

2. Sketch

Well it will be great if anyone is following a design process but can move ahead to the Sketch part because it is one of the important part in it. Start conceptualizing the ideas on paper before moving to the computer because once you will put all the thoughts on the paper then it will be easy to choose the few and finalize concepts for the digital designing process.
    

3. Choose the right Color

Always try to get the right color for the logo because different color has different meanings, communicate ideas and it affects organization/product image in the market. Also keep in mind that your logo should also function in gray-scale in worst situation.
     

4. Keep logo simple

While designing logo try to keep it simple because human mind scan & remember simple things easier and longer. As you can see flat design is a best example for it they have reduced the clutterness and removed the unwanted elements in the design. Same logic works in the logo design also. A simple logo is always memorable.
  

5. Logo should be versatile

Logo should be versatile because it is used in different places and in different collateral so it should work across variety of medium and application.

6. Logo should be unique

Logo should be unique in that way that it should stand out in the crowd and the market. For example apple logo without byte has no meaning it is that byte which makes it unique.

7. Logo should be scalable

Logo should be scalable for that always start making designing in vector format because it is always scalable. Logo must be scalable and effective in inch sizes. 

8. Better to have your handmade font for logo

It will be great if you made custom typeface/font for logo because if you are going with available fonts in the market then it will not be unique more once it is discovered by other people. So always try to make custom handmade fonts.
   

9. Learn from other’s logo success

Always look in to other works and learn from their successful logo story. Thousands of great successful logo case studies are available online read it to understand their process and their thinking what techniques they used to make a good logo.

10. Learn the software

Well if you are a graphic designer then it is expected that knows that software which is required for logo designing if not then start learning software from today itself. It hardly takes a month to mastering it. Illustrator and Coraldraw are the main software which is used by most of the designer and lots of tutorials are available online. But always keep in mind with brainstorming or idea jumping on the software is not going to help you.

Author: Shivin Mittal ( @MittalShivin)

UX & Virtual Reality - Designing for interfaces without Screens

Virtual Reality

It’s an experience that’s been around since the mid­ 80s, but technology always seemed to hold it back. The advances in smartphones and related technologies have finally brought the incredible potential of VR within reach. Now, we’re in the midst of a virtual reality revolution. The concept was coined around 1955 and so many years later VR is back in a big way with Oculus, Samsung Gear VR, Project Morpheus, Google Cardboard, HTC Vive, OSVR, and other smaller or yet to be announced players. The well-known tech giants Facebook, Google and Microsoft are keenly investing in VR which indirectly proves that it is going to be the game changer of this century.

What are they trying to do with VR?

It’s really just immersive software. You know how your phone is a tiny screen that you sometimes ignore? Virtual reality is pretty much the opposite. It uses a headset (a big pair of glasses) that fills your entire field of view with an image. You turn your head left, you see left. Turn your head right, you see right. You will be framed inside a virtual world with virtual things with which you can interact, play, design and experience.

The VR Process

Designing for a flat 2D screen versus designing for 3D Virtual Space has its own challenging factors. Achieving the best user experience in VR Devices is the key success of the entire concept. As it is a combination of various factors such as Head Movement Tracker, Eye Tracker, Gesture Capture, Mind Map etc., making all these sync together and binding them perfectly with the design and visuals of your application takes a lot of effort and thought process.  

Who can utilize VRs?

Everyone. Yes, VR Headsets are of 3 categories affordable for all set of people around the world. Every single application that you are using in your mobile phones and computers can be designed for Virtual Reality. There is a big misconception among the people saying that VR is favored only for Game Development, which is totally wrong. Interior Designers, Doctors, Industrial Designers, E-Commerce, Banking and every other random line of business can use Virtual Reality for their work.

1. The low-end entry level headset. It’s actually just a fancy smartphone case. You slip your phone into pair of lenses that strap onto your head like a scuba mask, and there you go, you’re into the VR world! You can build these things out of plastic, or even, as Google demoed some years back, Google Cardboard. Samsung has one such model on the market today for $200.

2. The mid-range headset. It’s totally self-contained, like an Oculus Rift or Sony's Project Morpheus, with its own display and probably some headphones. Think of it as a really nice TV or computer monitor for your face. Maybe you plug it into a phone or a PC to play games or watch movies. Oculus which is acquired by Facebook is selling its latest dev kit.

3. The Augmented Reality. It is one step ahead of the Virtual Reality where we are binding the real world visuals with virtual stuffs. Imagine, you walk on the road and you can see the visuals, pins, navigations of the Google Map on your path. Two Big companies, Microsoft with its HoloLens and a headset by Magic Leap are trying to accomplish this concept.

UX Principles for designing Virtual Reality

1. Everything Should Be Reactive 

Every interactive object should respond to any casual movement. For example, if something is a button, any casual touch should provoke movement, even if that movement does not result in the button being fully pushed. When this happens, the haptic response of the object coincides with a mental model, allowing people to move their muscles to interact with objects. When designing a button: use a shadow from the hand to indicate where the user’s hand is in relation to button, create a glow from the button that can be reflected on the hand to help understand the relationship, use sound to indicate when the button has been pressed (“click”) 

2. Restrict Motions to Interaction

The display should respond to the user’s movements at all times, without exception. Even in menus, when the game is paused, or during cut scenes, users should be able to look around. Avoiding Simulator Sickness and slowness is the key part of improving the UX in Virtual Reality Applications. Do not instigate any movement without user input. Reduce neck strain with experiences that reward a significant degree of looking around. Try to restrict movement in the periphery.

3. Text and Image Legibility

Bigger, brighter and bold texts should be used to indicate widgets. Images should be realistic and appealing to the user. The mind of the user is going to be entirely mapped into the virtual reality for a prolonged amount of time. Texts should be readable and legible for unstrained viewing of the user. Brighter and vivid the colors are, more involved the users will be.

4. Ergonomics

Designing based on how the human body works is an essential to bringing any new interface to life. Our bodies tend to move in arcs, rather than straight lines, so it’s important to compensate by allowing for arcs in 3D space

5. Sound Effects

Sound is an essential aspect of truly immersive VR. Combined with hand tracking and visual feedback, it can be used to create the “illusion” of tactile sensation. It can also be very effective in communicating the success or failure of interactions.

Google’s Design Guidelines for Virtual Reality

Google has listed some key principles involving physiological and ergonomics  consideration to be noted while designing for Apps that can run on Google Cardboard. They are pretty much straight-forward for the designers to understand. 

1. Using a Reticle

2. UI Depth & Eye Strain

3. Using Constant Velocity

4. Keeping the User Grounded

5. Maintaining Head Tracking

6. Guiding with Light

7. Leveraging Scale

8. Spatial Audio

9. Gaze Cues

10. Make it Beautiful

References

Google’s Cardboard Guidelines, Best Practices for Designing Oculus Rift

About Author 

Prashanth Shanmugam

With 3 Years of Professional Experience in Design and technology, I have a great passion for UX Design, Usability Testing and User Research. With a formal knowledge of Design Process, I prototype Interactive and Intuitive Designs for Desktops, Mobiles and Wearable Technologies. 

UI Design Best Practices and Common Mistakes

Although the title UI designer suggests a departure from the traditional graphic designer, UI design is still a part of the historical tradition of the visual design discipline.

With each movement or medium, the discipline has introduced new graphic languages, layouts, and design processes. Between generations, the designer has straddled the transition from press to Xerox, or paper to pixel. Across these generations, graphic design has carried out the responsibility of representing the visual language of each era.

As UI design transitions out of its infancy, what sort of graphic world can we expect to develop? Based on the current trajectory, the future looks bleak. Much of UI design today has become standardised and repeatable. Design discussions online fixate on learning rules to get designs to work safely rather than pushing the envelope or imagining new things.

The tendency for UI designers to resort to patterns and trends has not only created a bland visual environment, but it has also diminished the value of the designer as processes become more and more formulaic.

As we review UI best practices and common mistakes, the most pressing concern is not technical proficiency but avoiding an onslaught of repetitive and visually boring designs.

The top five most common UI design mistakes are:

1. UI designers have become rule-obsessed.
2. The grid is restricting the creative process of UI designers.
3. UI design has been standardized with patterns.
4. Typefaces are tragically misunderstood.
5. Contrast is not a design cure-all.

Understand principles and be creative within their properties. Following rules will only take you where others have been.

Common Mistake #1: UI Designers Have Become Rule-obsessed

The world of graphic design has always followed sets of rules and standards. Within design disciplines, common mistakes closely coincide with a standard rule that has been broken. From this perspective, design rules appear to be trustworthy guides.

However, in every design discipline, new movements and creative innovation have resulted from consciously breaking rules. This is possible because design is conditional and requires designer discretion. Design is not a process with finite answers. Therefore, design rules should be considered as guidelines rather than cold, hard facts. The experienced designer knows and respects the rule book just enough to be able to break out of the box.

The way design is discussed online often revolves around lists of do’s and don’ts. Master the 10 Easy Steps to Design Perfection! Unfortunately, design requires a much more robust understanding of principles and tendencies. The path to good design does not run through systematic adherence to checklists.

Interestingly, if designers stop breaking rules, then no creative breakthroughs can be made. If UI designers only develop the ability to follow guidelines rather than honing their decision-making abilities, they may quickly become irrelevant. How else will we argue that our work adds greater value than off-the-shelf templates?

Be Wary of “Top 10” Design Rules

The issue with design rules in today’s world of UI design is their abundance. If designers need to solve problems, they can simply look to the existing UI community and their set of solutions. However, the plentitude of these guides and rules undermine their credibility.

A Google search for “Top UI Design Mistakes” yields a half million results. What are the odds that most, if any, of these authors agree with one another? What is the likelihood that each design tip offered accurately coincides with the design problems of a reader?

Often, online educational articles discuss acute problems rather than the guiding design principles behind an issue. The result is that new designers never learn why design works the way it does. Instead, they become dependent on what has come before. Isn’t it a concern that so few of these articles encourage design experimentation or play?

Designers should draw on a toolkit of guiding principles rather than a book of predetermined rules and design templates. “Press x for parallax scrolling and y for carousels. Before choosing, refer to the most recent blog post on which navigational tool is trending.” B-o-r-i-n-g-!

Tips and “Top 10” Lists Follow Predictable Trends

Trends are like junk food for designers. Following them produces cheap solutions that offer some initial payback but little value over the long haul. Trend-following designers date themselves quickly. The reward for following someone else’s design path? A gnawing sense of professional emptiness.

It’s true that working to invent your own styles and systems is hard work, but it’s absolutely worth the effort. The daily gains and breakthroughs are all your own. There’s something about copying that never seems to feed the designer’s soul.

Common Mistake #2: The Grid Is Restricting the Creative Process of UI Designers

Despite my rant against rules, here’s one: It’s impossible for a UI designer to work without a grid. Web and mobile interfaces are fundamentally based on pixel-by-pixel organization—there’s no way around it.

However, this does not mean that UI designers should only strive for grid-centric appearances. Likewise, there’s no reason for all design-related decisions to be based on a grid.

Avoid Using the Grid as a Trendy Tool

Generally, designing in response to trends results in poor design. At best, trends lead to satisfactory outcomes, but the overall impact is almost certain to be underwhelming. To be trendy is to be ordinary.

Therefore, when employing a grid in a design, understand what the grid has to offer as a tool and what it might convey. Grids generally represent neutrality as everything within the constraints of a grid appears equal.

Grids also allow for an unbiased navigational experience. Users can jump from item to item without any interference from the designer’s curatorial hand. With other navigational structures, the designer may be able to group content and establish desired sequences more intentionally.

Although a useful tool, the grid can be very limiting to designers.

Don’t Default to the Grid as a Workflow

Dylan Fracareta, faculty at Rhode Island School of Design (RISD) and director of PIN-UP Magazine, points out that “most people start off with a 12-column grid…because you can get 3 and 4 off of that.” The danger here is that designers immediately predetermine their work.

To prevent this, Fracareta only uses the move tool with set quantities, as opposed to physically placing things against a grid line. This has the double effect of establishing order and opening up the potential for unexpected outcomes.

Designing for the browser used to mean that we would input code and wait to see what happened. Nowadays, web design is similar to traditional layout design, where the process is “more like adjusting two sheets of transparent paper.” How can we, as designers, benefit from this process?

Although grids can be restrictive, they are one of our most traditional forms of organization. The grid is intuitive. The grid is neutral and unassuming. Grids allow content to speak for itself and users to easily navigate an interface. Despite my warnings towards the restrictiveness of grids, different arrays allow for varying levels of guidance or freedom.

Common Mistake #3: UI Design Has Been Standardized with Patterns

The concept of standardized design elements predates UI design. Architectural details have been repeated and applied to similar design circumstances for centuries. This practice makes sense for parts of a building that people rarely perceive.

However, once architects standardized common elements like furniture dimensions and handrail heights, people began to express disinterest in the beige physical environments that resulted.

Once considered best practice in the field of architecture, we now realize that row after row of standardized office furniture made for an agonizing work environment.

Not only this, but standardized dimensions were proven to be ineffective. Based on statistical averages, they often failed to serve large segments of the population. Repeatable details have their place, but they should not be used uncritically.

Designers Shouldn’t Use Patterns as Products

Many UI designers view patterns as something greater than a simple time-saving tool. They see them as off-the-shelf solutions to complicated design problems. Patterns are intended to standardize recurring tasks and artifacts in order to make the designer’s job easier. Regrettably, certain patterns like carousels, pagination, and F-patterns have become the entire structure of many of our interfaces.

Is Pattern Use Justifiable?

Designers tell themselves that the F-pattern exists as a result of the way that people read on the web. Espen Brunborg points out that perhaps people read this way as a result of our F-pattern overuse. “What’s the point of having web designers if all they do is follow the recipe?” Brunborg asks.

Common Mistake #4: Typefaces Are Tragically Misunderstood

Many “Quick Tips” design lists suggest hard and fast rules for fonts. Each rule is shouted religiously, “One font family only! Monospaced fonts are dead! Avoid thin fonts at all costs!” This is nothing more than hot air.

The only legitimate rules on type, text, and fonts center on enforcing legibility and conveying appropriate meaning. As long as the text is legible, there may be opportunities to employ a variety of typefaces. The UI designer must take on the responsibility of knowing the history, uses, and design intentions for each font implemented in an interface.

Typeface Legibility Reigns Supreme

Typefaces convey meaning and affect legibility. With all of the discussion surrounding rules for legibility on devices, designers are forgetting that type is designed to imbue a body of text with an aesthetic sensibility. Legibility is critical—this isn’t to be disputed—but it really should be an obvious goal. Otherwise, why would we have a need for anything beyond Helvetica or Highway Gothic?

The important thing to remember is that fonts are not just designed for different contexts of legibility. They are also essential for conveying meaning and giving bodies of text nuanced moods.

Each typeface is designed with its own use case in mind. Don't allow narrow rules to restrict an exploration of the world of type.

Avoiding Thin Fonts at All Costs Is Unwise

Now that the trend has come and gone, a common design criticism advocates avoiding thin fonts entirely. But do we need more regulations? Shouldn’t the goal be a deeper understanding of the design principles supporting typefaces?

Some designers are convinced that thin fonts are impossible to read or untrustworthy between devices. Legitimate points. Yet, this represents a condition in the current discussion of UI design where typefaces are only understood as a technical choice relating to legibility. If legibility is the only design concern, why not banish thin fonts altogether?

A more holistic approach begins with understanding why a thin font might be advantageous, and within what contexts. Bold, thick text is actually much more difficult to read at length than thinner text. Yet, as bold fonts carry more visual weight, they’re more appropriate for headings or content with little text.

Thin fonts often employ serifs, making them suitable for body text. How so? Serif characters flow together when viewed in rapid succession, making them more comfortable for long periods of reading.

Additionally, thin fonts are often chosen because they convey elegance. If a designer is hired to create an interface for a client whose mandate is visual sophistication, it would be difficult to find a heavier typeface to do the job.

Fonts Require Variation to Establish Hierarchy

A common UI design mistake is failing to provide adequate variation between fonts. Changing fonts is a good navigational tool that helps to establish a visual hierarchy within an interface. In general, the largest items (or boldest fonts) are most important and carry the most visual weight. Visual significance helps users identify content headings and frequently used functions.

Too Much Variation Undermines Hierarchy

The issue with making every font choice unique, especially when an interface contains many typefaces, is that nothing really stands out. If every font is different, it becomes difficult for users to recognize important content or establish a sense of visual order.

Common Mistake #5: Contrast Is Not a Design Cure-all

A common thread that appears on many “Top Mistakes” lists encourages UI designers to avoid low-contrast interfaces. It’s true that there are many instances in which low-contrast designs are illegible and ineffective. However, my worry, similar to my points on thin fonts, is that the use of absolute language leads to a homogenous, high-contrast design culture.

Defaulting to High Contrast Is Careless

High contrast visuals are undeniably stimulating and exciting. However, there are many more states within the human emotional range worth conveying. To be visually stimulating may also be visually safe.

Take, for instance, the entire industry of contemporary sci-fi film. It seems as though every production has resorted to black and neon blue visuals as a way of tricking viewers into excitement. Would it not be more effective to interweave narratives with both high and low contrast images that provoke a broader scope of emotional responses?

Functionally, if every element in an interface is in high contrast to another, then nothing stands out. This defeats the potential value of contrast as a hierarchical tool. Considering different design moves as tools, rather than rules, is essential to avoiding stagnant, trendy design.

Conclusion

At best, design rules are guides. They provide decision-making safety and warn designers of the dangers of thoughtless choices.

Conversely, design rules are not laws. They are not unbreakable, and they are certainly not deserving of our undisputed surrender. In fact, design rules, when followed recklessly, can become serious crutches that weaken our ability to solve problems creatively.

Designers are not scientists. We are not bound to provide empirical evidence for every aesthetic decision we make. It’s true that our profession is one of process and deliberate judgments, but there is room for instinct and ingenuity. In fact, our ability to help our clients stand out in a cluttered world of trendy content depends on our willingness to imagine new possibilities.

We must experiment. We must play.

Design rules exist to be leveraged for visual advantage. They may be bent, even broken, but they are never to be blindly followed.

This article was originally published at here

About Author

Micah Bowers
Designer

Sketch vs. Photoshop: Is It Time To Switch From Photoshop To Sketch?

It seems that Sketch is becoming an increasingly popular design tool, gaining more and more market share around the globe.

After being made fun of for not using it during an interview, and hearing a lot of designers rave about it,I decided to take the plunge, but after using Sketch for a couple of months, I came away with mixed feelings.

Therefore, I’ve decided to share my experience with fellow designers, because I suspect a lot of them are facing the same Sketch vs. Photoshop dilemma.

Sketch vs. Photoshop? It's a tie or clear victory for either, depending on how you look at it.

Here are my thoughts on some of the key points differentiating these two tools. I hope my experience will help others decide whether it is time to jump ship and ditch Adobe for Sketch.

What Is Sketch And Why Should We Care?

Sketch is a mockup / UX and UI development tool created by Bohemian Coding (someone other than Adobe; yes, I know it’s hard to believe), and the newcomer has managed to unsettle Adobe, which was the undisputed industry leader for decades.

What makes Sketch different?

In as few words as possible, Sketch promises faster workflow and easier use than its counterparts. You could think of Sketch as Illustrator with some Photoshop stitched together, but that’s only part of the story. Many Adobe features that you don’t use 90 percent of the time were stripped out, so what we end up with, is a streamlined tool, designed to quickly prototype everything from simple wireframes to complex mockups.

Compatibility

Let’s get the elephant out of the room first: If you are using a PC, working outside the US, and most of your clients and team members do not use Macs, then you can probably stop reading now since you will constantly deal with users that can’t use your files.

Sketch is only available for Mac OS X, sorry PC users, there’s no Windows version and you shouldn’t expect to see one soon.

Sketch vs. Photoshop, Round One: Compatibility. Photoshop still has the upper hand, as it’s not limited to Mac OS X.

If you are a designer you are probably using a Mac anyway, so the next few points ought to make it easier for you to decide if you should try convincing everyone else to switch to Sketch.

If you are planning on using Sketch mostly for wireframes, there is still hope for multi-platform compatibility since you can export files to SVG and PDF format; you can get some editing capabilities back once you open it in Illustrator.

The only other way of making sense of Sketch files on Windows is by employing specs tools, namely Avocode.

Interface

If you are used to Photoshop and Illustrator, you will feel semi familiar because the Sketch interface looks like it was re-imagined by someone who might have worked at Adobe. You can learn everything you need to get started in a matter of hours.

From time to time it does feel like the Sketch team decided to move things around just to differentiate their product from Photoshop.

For example, you have your layers on the left (don’t know why they didn’t leave them on the right side, other than to look different).

Layers panel is pretty much a stripped down version of the Photoshop panel. You will see this area get quickly populated and disorganized as soon as you start working on anything complex. Unlike Photoshop, you can’t organize it into colors or see all the the little effects that you applied, and since you can click through the layers on your board you will quickly forget it even exists unless you want to move an artboard. This might be a good thing since I noticed that I spent more time designing than managing and messing around with my layers (like Photoshop). The right side shows options for specific tools once you click on them.

Since Sketch is more lightweight on features, everything fits on the right. You don’t have to dig around trying to figure out if your settings decided not to show up because you switched to a different layout last time you used it. In Sketch even features that could be considered “hidden” in Photoshop, such as blending options, show up on the righthand panel.

The simplified UI approach works, but it’s not perfect. Things sometimes disappear into Option buttons (even though there is still plenty of space for them). For example, if you want bullet points, Sketch assumes you don’t use them often, so they are tucked away under a gears icon that you end up clicking a lot thinking something else might be hidden there.

You can customize the top toolbar to add hidden functionality, such as rectangle and circle objects, for easy access (until you learn the shortcuts and get rid of them, again).

My opinion? I am fairly happy with the Sketch interface; it’s simple and you will get used to it within a few hours. This is a big deal because designers usually don’t have a lot of time to waste. The ability to try out a new tool and figure out the UI in a short time is a good way to get more professionals to try it ; they don’t have to waste days figuring out the basics, they can do it in a few hours while they work.

Creating Objects

Creating objects with Sketch is one of my favorite aspects. Simply press “R” and you got a rectangle, press “L” it draws a line (yes, Adobe Illustrator has shortcuts too, but they are harder to remember and don’t work as smoothly). By the way there is a great shortcut guide blog post here.

You can quickly jump inside groups (similar to Illustrator, but a lot more transparent) by double clicking an object. This means you are able to throw together a wireframe and adjust things instantly (however, you can’t rotate objects by dragging a corner, for some reason). Resizing an object keeps its properties too, so if you hated how your rounded corners got messed up in Photoshop when you transformed your square, you are going to love this particular aspect of Sketch. The snap-to-grid works a lot better than Photoshop’s or even Illustrator’s; you will actually use it to align things instead of wondering where Adobe came up with those alignment points.

Photoshop still has the upper hand as far as modifying and tweaking objects since it’s part of a more elaborate, full-feature photo editing software suite. If you are working with intricate skeuomorph designs, Photoshop might work better for you since it can do more and you don’t have to learn a new interface.

However, this isn’t really good news for Adobe because design trends are changing, and skeuomorphism is already considered passe. Contemporary design is minimal, clean and flat, making Adobe’s lead in this department a lot less relevant than it would have been a few years ago.

Artboard Workflow

So, the next thing that a Photoshop and Illustrator user will be familiar with are artboards.

Artboards in Sketch may be described as a mix between Photoshop artboards and Illustrator’s. They are really easy to create, like in Illustrator, and show up as sections in your layer panel, as in Photoshop.

You can also have separate pages; think of it as tabs, all within one document. So you can have a page for your mobile artboards and a page full of desktop artboards, all in one document without bunching everything into a single space. Objects can be placed outside the artboards, just as in Illustrator (although it doesn’t work as well; I quickly discovered that this particular feature is still a bit buggy).

For example, I can drag an object from one artboard to another and it will sometimes disappear into nothingness because it’s still, technically, part of the other artboard group (good luck finding it in the layer panel!). Oh, and sometimes this works as it’s supposed to, thus creating awesome workflow frustrations.

Symbols (Aka Photoshop Shapes or Smart Objects)

Another semi-convenient thing in Sketch is the use of Symbols, a concept Photoshop users will be familiar with, but Adobe likes to call them Shapes. I got super excited when I clicked on the shapes icon and I got the following drop down:

Symbols are, basically, a group of objects, sort of like smart objects in Photoshop. In Sketch, symbols get their own drop down menu. All symbols are unique to an open document. Built in Sketch templates place them on their own separate page by default (although you don’t have to), so you can easily switch to it and see all the symbols that are at your disposal.

Here is why this is all only “semi convenient:” The first thing I did is something many designers do when they try out a new tool; I downloaded a bunch of free icons with hopes of speeding up my workflow.

This is where the fun stopped. Sure, you can import symbols, but they will be regular objects in your document by default, even if I drop them into the symbols designated page, as you see i did above. Unfortunately, you have to manually convert each item into a symbol, and spend time organizing them, in order for them to show up in your drop-down, so you will likely end up pasting them, just as you did in Illustrator, instead of utilizing the fancy symbols drop down menu. This time you are just pasting from a different Sketch page.

Of course, you can spend hours setting up a perfect starter template to avoid this. I like how Photoshop does it: You simply download a shape file from the internet and load it as you need it; shapes will be available all the time for all documents.

While we are on the subject of symbols, it’s really easy to accidentally modify a symbol, where it replicates in all your artboards, in Sketch. Yes, you can watch out for it and make sure you convert it to “no symbol” when you are editing this object, but trust me, you will do it at least a few times. You will be surprised to see stuff move or change on something you already finished. The most common problem I encountered was editing the button text and then forgetting to check the “exclude text value from symbol” option, consequently finding half my buttons renamed.

If it were up to me, I would advise Sketch developers to include some sort of a warning, or a lock feature, making sure that people don’t edit them accidentally. Photoshop is better in this respect because it opens a separate window when you need to edit your smart objects.

Styles Done Better

When you add a text box and you are working from a template, Sketch automatically adds a style to it. It is also easy to create and define new styles. So easy, in fact, that you will be accidentally overriding them half the time and then watch in horror as your changes propagate to all your artboards. (Actually, most of the time you won’t notice it until you are presenting.)

This is when you pray the Undo button actually works (more on that later). I would say styles implementation is better (since you are forced to use them) than Adobe’s, where I have to spend time manually setting up styles and then forget to use them, anyway.

You will eventually learn to check if the styles dropdown is highlighted before you make any changes. However, you can still trigger it, maybe by resizing an element with text in it, thus changing the font size and triggering a global style change. It would be cool if there were a way to prevent this, maybe through some sort of lock button that you have to press before messing with styles. Or, perhaps, style application is cleared if you change an object (as in Photoshop), or only allow style changes from the designated Symbols / styles page.

Exporting

Yes, it’s easier and faster to export in Sketch. Simply drag artboards to your desktop and it saves them, and it’s easy to specify the resolution, such as 2x, for Retina-class tablet displays and so on.

Not that you can’t do these things in Photoshop, which now has a “quick export to png” option when you right click on items; it’s just a little faster and better implemented in Sketch. However, you can’t export your entire screen, only artboards (as in Illustrator). It’s something to remember before you draw arrows between artboards to guide the wireframe flow.

Another significant plus for Sketch is that it’s a vector-based tool, just like Illustrator. Your design will look good on all devices and assets, it won’t be as huge as your Photoshop files, and you can even save them as SVGs.

Sketch vs. Photoshop, Round Eight: Exporting assets. Step aside Adobe, Sketch wipes the floor with Photoshop.

Speed And Stability

This is a big one. Yes, Photoshop can be slow, so you need a lot of RAM, processing power and fast storage if you want to open a dozen artboards simultaneously. That said, Photoshop runs fairly well on my Macbook Pro 2013, and even though things get a little sluggish from time to time, I didn’t feel like these performance issues hinder my workflow. Yes, this can be a nuisance, but it’s not a serious problem in most situations. You are also more likely will have Illustrator open alongside, to import vector objects, which further adds to the overall Adobe speed footprint on your computer.

The great thing about Photoshop and Illustrator is that they are polished products and I am willing to trade speed for stability, any day.

Sketch may be described as the opposite. Sketch has a smaller footprint, it’s really fast, and allows me to have 40 artboards on screen and quickly move things between them without a hint of sluggishness. Unfortunately, this is where the good news come to an end. Despite being around for a few years, it still has a lot of bugs . Some users (including me) feel like they are using a beta product, and stability can be a deal-breaker for many people.

Thankfully, I never had it crash on me. However, you should expect some unexpected behavior like the undofunction not working (this particular bug has been documented for a month now), or undoing some random step on some random art board without the ability to get it back. I actually had to stop using undo in my workflow because of this bug. In one instance, undo completely deleted one of my artboards and everything in it with no way of getting it back. This is not the only bug, although I found it the most frustrating. You should also be ready for inconsistent line spacing and text resizing. I remember one time I loaded a file for a client presentation and half my objects were moved to the right by about 20px, making me look like a noob designer who can’t align things.

Let me be clear. Sketch is buggy, but it is not buggy enough to be considered unusable or unsuitable for serious work. Having said that, I think many users will reach a point where these minor glitches start to annoy them to a point they consider switching back.

Plugins

Sketch has a lot of cool plugins, such as those that allow users to automatically populate text fields, and so on. There are also pretty extensive plugin databases out there, and most of them are free. Like Sketch App Rocks. Also, most plugins are geared towards simplifying workflow and performing certain actions faster.

Photoshop has a range of plugins to choose from, too, however, they are not as focused on UX/UI design (because it’s a photo editing tool) and they are scattered around the Internet. However, I must stress that the best and most commonly used plugins are available for both platforms such as the awesome Free Invision Labs plugin that allows you to easily create repeated elements and add filler content. Sketch is the new hip thing, so new plugins and sites dedicated to it are popping up everywhere.

Sketch vs. Photoshop: Conclusion

For me, it’s a tough choice. I really wanted to fall in love with Sketch, however some of its limitations keep me from jumping ship. Yes, Sketch is faster and feels a lot more like an actual UI design tool than Illustrator or Photoshop. You will be able to build things much more quickly, even if you just moved from Photoshop and Illustrator.

Still, bugs will push the otherwise excellent speed back a notch, and Mac-only support really limits the scope of projects. For now, I am using Sketch solely for wireframes and smaller projects, and sticking to Photoshop for my main UI mockups.

Bottom line? You won’t go wrong with Photoshop or Sketch. Both have excellent use cases, and neither will miraculously turn you into an ace designer.

You should ask yourself questions such as, “Do I enjoy using buggy, but cutting-edge software?” or, “Do I want to fall for the hype?” If the answer is, “Yes,” then go for it! If you are an Adobe veteran, you can probably afford to wait a few months for Adobe Comet to launch. By the looks of it, Comet will pretty much do what Sketch does, plus animation and artboard linking. Ultimately, these are just tools for your workflow. They are not going to make you a better designer, they might just speed up your workflow, and that’s all.

Personally, I have added Sketch to my toolbox, even though I have to check my files each time I open them to make sure they didn’t get changed by one of its bugs while I was asleep. Things will get better, there’s no doubt about that, but the question is when? Sketch managed to gain a huge following, yet it failed to iron out all the kinks. I only hope that the imminent launch of Adobe Comet will create a new sense of urgency and force the Sketch team to address more bugs in the coming weeks and months.

This article was originally published on Toptal

About Author

Alex Gurevich
Alex has built, managed, and led a company that provided web solutions, branding, and marketing consulting services. He grew it from a small startup to one of the best design firms in the city in less than eight years.
Email: jordan.lyons@toptal.com