1

ad here

Colours form an integral part of the world we live in. And more often than not, our feelings, emotions and even taste can be validated with colours! According to an article written by Charles Spence in BioMed Central 2015, five colour-taste studies were conducted and their results indicate some startling results.

For example, the colours black, purple and violet are widely associated with bitterness. White and blue is associated with the salty sea. Yellow and green represent a sour taste, because of its obvious recall to limes and lemons. Sweet is linked to pink or red.

Truth be told, colours can have a major influence on people’s purchase decisions. Most brands are associated with one or more colours; organizations have embraced the colour psychology as a major driver in their branding strategy. Why? Because people are drawn to certain colours for certain reasons and they carry associations with objects and tend to feel them.

Colour - Lollypop Design

As designers, we need to pay detailed attention to the colours we choose while designing a brand. Colour creates contrast, hierarchy, balance & rhythm. Choosing the right colour palette is important as it not only creates interest but also creates an emotional or subconscious connect with the people. Here are a few tips by Shrivathsan Raguraman, Sr. UI Designer of Lollypop Design, have a look.

Understanding Colours is Understanding Product

Colour - Lollypop Design

Research indicates that 85% of the decision made by individuals towards choosing a product was based on colours only. Colours carry an emotional value; each colour emotes different feelings and perception; these aren’t general emotions that are associated with it but the whole nature itself is built around it and perceived in a psychological aspect. For example:


Red – energy, power, and passion
Green – ambition, growth, freshness, and safety
Blue – tranquillity, confidence, and intelligence
Yellow – happiness, intellect, and energy
Black – power, elegance, and mystery
White – cleanliness, purity, and perfection

Questions and Considerations Before Choosing a Colour Palette

Before we get to explaining how to pick colours and go on to explaining the colour wheel, let’s be clear about a few fundamental questions that we should ask ourselves even before jumping on to the branding elements of the product. The questions would give you a sense of direction and make life simpler:

1) Are we designing for a brand new product or an established brand?

Brand New Product: Fresh branding might require you to understand the reasoning and the emotional connect of the brand. It will give you much-needed freedom to chose and play with your colours, unlike the defined products. We generally prefer to choose either monochromatic or complementary as they create more emotional value and a sense of purpose.

Defined product: One should understand the product and the guidelines it comes with. There might be many limitations or directions that we need to follow. So get acquainted with it. For example, Google or Microsoft has strict guidelines. In such cases, we suggest you choose the Analogous/ Triadic palette as they allow to stick to the prominent brand colour while allowing to play with the other colours from the wheel as an accent. It is like choosing a group of friendly neighbours to build a harmonious product.

2) Do we understand the product?

Colour - Lollypop Design

What is the intent of the product? What does it want to communicate? What problem does it want to solve? Who will use this product?  These questions will lead us to shortlist the primary and secondary colours of the product.

3) Do we understand the users well?

Colour - Lollypop Design

Who are the users we are targeting? What are there behavioural graphs? What their mental models like? How tech-savvy are they? What region do they belong to? What is their culture? Everything comes into play when you are deciding on the brand colours. Ask as many relevant questions as possible.

4) Are we accommodating the W3C principle?

Colour - Lollypop Design

Choosing a palette also involves accessibility as one of the major challenges for a product designer. As a designer, you must ensure that the product is accessible by all sets of colour vision deficiency personas. Adding to that, textual contrast check is really important which needs to be done before adding any coloured text over any background colour. This allows us in covering the CVD people by providing them with an accessible product.

How do we choose the colours?

Finally, let’s decode the different sets of colours and principles that will always make life easier as designers. Always look up to the nature of the product when it comes to choosing colours but before you go overboard looking for inspiration you have to understand the basics of the colour wheel. Follow Colour theory 101; there are many diverse ways of picking colour sets that work together. Try to pick the combination best suited for you ranging from those that are easy to use till difficult to use. We’ll explain this further below:

• Complementary – Easy To Use

As the name suggests, these colours are placed adjacent to each other in the colour wheel.  They complement each other perfectly. This colour scheme works best for brands that are trying to communicate reliability and a sense of balance. It’s like the colour blue says ‘you are beautiful’ to the colour orange, which complements its attributes, and vice versa.

RunAdam or Paytm Money are good examples of brands with complementary colours.

• Monochromatic – Easy To Use

These colours share the hues and tones of a base colour. When you use shades of the same colour, the ideal notion behind this is that it creates harmony and natural sync. Monochromatic colour sets are easy to remember since the user can associate these shades with one another and still can remember what brand or product it is.

Farmrise would be a great example of a monochromatic colour brand.

• Analogous – Exercise Caution

The word analogous means ‘comparable’. Under this, analogous colours refer to any set of colours on the colour wheel that are immediately adjacent, i.e, three colours left or right from the one of your choosing. As a set, these four colours will be considered as analogous colours. Analogous colours are preferred when there is a need to create a sense of harmony and contentment for brand design.

Paypal, Mastercard are good examples of brands with analogous colours.

• Triadic – You can try

This method is akin to choosing colours that are evenly spaced in an equilateral triangle. These colours are selected from the wheel in such a way that they provide high contrast and rich vibrancy in design. How do we do this? By picking colours, (to the left or right) that are equally spaced from one another on the colour wheel. For example, if you pick a specific colour on the wheel, you can go ahead and pick a colour that is three colours away on either side. These contrasting colours make for an effective, yet tough to create a palette.

Mozilla and  Burger King are good examples of the brands with triadic colours.

• Tetradic – Are you brave enough?

This is a four-colour structure evenly spaced on the colour wheel. This scheme is best suitable if you want to create an accent with colours, ie, you choose one dominant colour and three accents supporting it. This colour scheme is similar to triadic, which creates a vibrant and strong palette but is tough to handle.

Google & Microsoft is a good example of a Tetradic colour scheme.

Suggested Tools

Our suggestions towards tools that can be used to choose your palette:

 

Coolors.co – It’s super easy to use and it can show you multiple analogous variations of a single hue.

Adobe Color – Make your own colour palette from colour-wheel to hexcode and easily use it with most adobe apps & software.

Canva Colour wheel – It helps to generate your combinations and help build your palette.

Hope this helps you in building a beautiful palette for your product, Happy branding!

ad here

User Interface Design has become a force to reckon with in the last few years. It has completely reshaped how we consume technology and interact with machines in ways that were previously unthinkable. UI design is not just a means to appease a user’s artistic sensibilities but is also used to create sticky digital experiences.

As we go into the next decade, our dependence on digital products and experiences grows, propelling User Interface Design into the league of the most consequential disciplines in current times. Let’s see what we have in store in 2020. Here are 8 UI Design trends by Lollypop Design that every UI designer must stick by in next few years.

1. Bold Oversized Typography/ Variable Typography

One of the primary differentiators of advertising today verses that about a decade or so ago is the use of bold typography. The fonts we use today perform the dual task of attracting customers and conveying brand personality. Bold typography has incredible potential when used appropriately and purposefully in the right place and the right amount. Big typography can be used to define visual hierarchy. Nothing brings out the simplicity of design in a minimalist website like bold typography. It provides a sense of visual demarcation to a particular section in your design and draws users’ attention to the message being delivered. Powerful statements in bold used in website headers quintessentially serve as elevator pitches and give most decision-taking information to the user. 2020 will be the year of reckoning for minimalist design and crisp, attention-grabbing headers in bold typography.

2. 3D/Realism Illustrations and Typography

3d designs in typography have been on a wave in the sphere of dimension design currently. From illustrations to topography to data visualisation techniques in the form of interactive infographics, 3d realism seem deeply embedded in UI design for a variety of products. User interactive design is building experiences through which people are experiencing a variety of personal and professional products and software. Augmented reality is pushing the envelope across industries, finding a variety of use cases pre-emptive healthcare, gaming design as well as e-commerce. Simple geometric shapes in an abstract composition are also trending. UI is balancing creative 3d illustrations with ample white space to emphasize bold colours and brand messaging.

3. Augmented / Virtual Reality/ Mixed Reality

A few prophecies around UI design suggest that in 2020 screens will become obsolete. Users will interact with SmartWare and will have experience all around them in the form of Augmented/ Virtual/ Mixed Reality. Immersive user experience without physical device hindrances. Users in this digital age don’t want to just see things— they want to actually live them. Augmented Reality or AR is a set of computer-generated information that can be experienced through tactile movements in wearable devices, which is slowly blurring the lines between virtual and reality. 2019 witnessed virality in the adoption of a plethora of VR & AR experiences ranging from Occulus Rift to Fitbit to Pokemon Go. This is why 2020 is the year in which lifeless and flat experiences are not going to truly make the cut.

4. Low Key Gradients

Too bright and flashy gradients are no longer in trend. Most designers prefer to use very simple and subtle gradients. Minimalism is key. The trend for low-key gradients came from the web along with flat-design. However, gradients are needed in graphic design to give the image volume and “depth”, so you just have to refuse “screaming” colours. Sensibilities of the user have changed in the last decade. Experiences online are a mere experience of our physical existence, which is why technology and art often ape each other.

5. Broken Grids, asymmetrical layouts

Thousands of web pages are accessed by millions of users every day. In order to truly create something that catches the user’s imagination, eCommerce companies have introduced the concept of grid views and asymmetrical layouts. The grid is made of imaginary lines that help layout elements on the page stay in order. The website owners who want to be unique will start implementing a broken grid technique and placing design elements chaotically. Grid views instantly fragmentise the user’s attention and divert it strategic real estate on the web pages. This technique makes websites look more creative and will be the top web design trend for 2020.

6. Micro Interactions

While design solves universal problems, micro-interactions are the delightful moments your users have while using the product. Micro-interactions are critical moments for a product to offer a truly human experience. A micro-interaction can be an animation based tool to collect feedback, assist in the navigation of the site or just create a moment of pure delight for the user. Micro-interactions are tiny enticing moments built into the application, which stimulates a feeling of well-being once it is discovered by users. It is one of the best techniques for giving instant delightful feedback, improve customer satisfaction and increase retention. Micro-interactions are important not from a utility or ROI perspective, rather they increase the stickiness of the product and service and help generate positive word-of-mouth for the company.

7. Hand-drawn Illustrations

There is something really beautiful about hand-drawn illustrations, with all of its imperfections. It always stands out and leaves an impression on the visitors. Maybe it evokes more natural and human-centric feel about the brand. In 2019, we have noticed a repeating pattern in style preferences from clients. They seem to be more attracted to designs/illustrations that have a more organic and human feel.

8. Sound (Google Pay, Paytm)

UI design in 2020 will also see (or rather, hear) sound layers. This refers to a variety of sounds that will be incorporated with UI design, so users will be able to hear them when they are using a website or a mobile app. UI design with sound can add to the experience the user has and can make their journey on the website or mobile app much more enjoyable and pleasant. This trending UI design, however, is currently limited on desktop applications, as it can be quite distracting, but is quite prominent on mobile interfaces.

Conclusion

These UI Design trends for 2020 are not only for satisfying users’ aesthetics requirements. They are highly optimised to provide a greater degree of usability and accessibility to the end-users. A subtle combination of these trends backed with detailed user research will lead to a enriched user experience.

Hej Stylus! V3 is the first global pen stabilizer application for mac. It’s capable of smoothing out position, pressure, tilt and rotational values. It also maps pressure and stabilizes line drawing with the ruler tool. We have asked the team of the Lollypop to use Hej Stylus and share its pros and cons which are as follows:

Hej Stylus
Illustration by Elena Resko

Pros:

1. A useful tool for comic artists and illustrators who want to get their strokes precise and want to have control over their lines. Basically, the ones who want to improve line quality. Since it is good for tracing sketches and converting them to digital art.

2. The app has good tools that help in creating well defined geometric shapes and lines.

3. The app also enables to achieve the smoothness of lines.

4. The app can be easily used with the stylus or mouse.

5. It is helpful in creating vector art.

Hej Stylus
Illustration by Marcelo Gallegos
Illustration by Shimon Engel

Con’s:

1. The app lacks proper guidelines or tutorials to use for beginners. Though, it has a tutorial it is very difficult to understand and get started with.

2. The user interface (UI) of the app is not user-friendly.

3. The names of the tools are not visible on the toolbar, even when you hover on it.

4. The tools and interface are very technical to understand (Physics involved). For example, the meter on the app for stabilization is not easy to control.

5. The tools load very slowly, hence, it becomes time-consuming and is very cumbersome to use

6. The tools are limited to usage in certain areas only. It is good for people who sketch but it doesn’t suit every style of digital art.

More on Hej Stylus V3 here

Illustration by Gualter Amaro
Illustration by Samuel Labaute

We have seen a wave of change with many artists adopting iPad pro and vouching for the comfort and flexibility it provides. And, even in Lollypop, all the artists have been illustrating on Procreate and have been keeping their iPad pro closer; so we got on to understand what is it that they like so much about procreate and if they could share few insights of the features that might be of help.

We asked Preethika Asokan, Sr. Illustrator in-house to shed some light on Procreate. Here is what she had to say:

Why I love Procreate?

iPad Pro is my digital sketchbook and procreate is my favourite medium. As a professional Illustrator, I draw for a living, and I have no complaints at that. But at the end of the day, or on a day off, I am very tired and I get super lazy to sit in front of my computer again and draw for my personal projects. But ever since iPad pro and procreate came into my life, I can cozy up anywhere and draw more for myself. I can take the iPad to a park or a cafe, get some fresh air, Vitamin D and let the creativity flow. It’s like drawing with a pencil but with the digital advantages; the magic of undo, and myriads of colours and brushes to choose from, I am able to do wonders beyond imagination. P.S I still love my sketchbook and watercolors, they will be my forever travel buddies.

Features in Procreate 

The basic UI is easy to use if you are familiar with the other Illustration software like Adobe Illustrator or Adobe Photoshop. There are so many features and few amazing tutorials available online to learn it end to end. Now, I’ll just talk about some of my favourite features:

01 Drawing Guide

We have 2d, Perspective, Isometric, and symmetry. You can also change the grid size, customize your guidelines. Select drawing assists in the layers to paint strokes according to your guidelines. Now, making that fancy isometric illustration is super easy.

Procreate

02 Clipping Mask and Alpha Lock 

The clipping mask is a recent update from Procreate 4.2 that I absolutely love, this lets you clip multiple layers to the content of one layer, allowing non-destructive alterations.

 

The alpha lock is a transparency lock. If you turn them on in layers, any painting or other action you do on that layer will only affect the pixels that were already there.

03 Recolour

I use this feature way more than others because I am never satisfied with the colours I choose initially. I love to experiment with them. It’s under the adjustments, pick the colour you want to change in the particular layer, and experiment with your masterpiece. Adjust the flood option for desired results.

Procreate

04 Favourite Brush Set

You can easily import a custom made brushes to Procreate. But my most used brushes are procreate’s default brushes, they have some amazing range.

Procreate

05 QuickShape 

The ultimate update in 4.2 is about making shapes. I feel like my pain reached the creators and I feel so happy! With QuickShape you can create perfect shapes without lifting a finger. You draw a shape and hold, and QuickShape will create the exact shape you need, ta-da!

Procreate

06 Tips and Shortcuts 

Please check out the Procreate website, handbook and Instagram account for their tricks and tutorials. These are some basic shortcuts and gestures, that I wish I knew when I started using the application. Still, after a year of using the app, I keep figuring out new things that the app can do and feel stupid for not knowing it earlier.

07 Streamline for Brushes

If you want your line to be clean and smoother, increase the streamline percentage in the brush edits. This is an absolute delight to use if you want to do some precise hand lettering. Also with the stroke taper option under brushes, you can control the exact taper amount and shape.

Conclusion

I see that people often question whether to invest on Wacom Cintiq or iPad pro. Though I personally prefer iPad pro, I would say it depends on the work you do and specifications. Ipad pro and procreate is a great tool for all your personal Illustrations and to the extent your professional Illustrations also. I have used them for creating Illustrations for both Web and print and the results were pretty good.

 

But again, we have to remember Procreate is a raster software, so you don’t get the flexibility of resizing them quite often. The major problem I have faced with procreate is the artwork getting pixelated or blurred when resized. But they have recently updated an interpolation feature in transform, which helps out a bit with this issue. But needless to say that this is the best investment I had made recently. They may not replace Illustrator or Photoshop, but Procreate sure is one of my favourite software application.

 

Here are few of the illustrations done by me on Procreate:

Article by Preethika Asokan, Sr. Illustrator at Lollypop Design Studio

A picture is worth a thousand words. In this digital age, an illustration is worth many more. One of the most evocative forms of communication, illustrations perform the crucial task of both informing and entertaining an audience through widespread integration in published media, such as posters, flyers, magazines, books, teaching materials, animations, video games, and films.

Illustrations are an outlet of creative communication that captures the imagination of our era. From humble drawings made on paper, these have evolved into digital art-pieces that are developed on gadgets like Cintique, Wacom, I-pads, Surface pro pads and so on. Not only are these mediums easier to use, but they also lend artists more creative freedom through evolved tools that assist experimentation in newer ideas and style.

Illustrations are changing the way we view the world. Children born in the late 80s or 90’s grew up with the dawn of the Internet. They were present in a world that progressed from hand-held phones to smartphones; a world that transcended into hyper-connectivity. The immersion of the current generation in digital devices has propelled us forward and also altered the way we communicate forever. For baby-boomers technology feels pervasive, but for children, it’s available in welcome abundance. Illustrations are an integral part of this world. Digital art is all around us and will be for generations to come.

Below, we have discussed how illustrations have played a crucial role in easing the digital transformation and the widespread impact can be gauged from the changed human habits. This, in turn, has impacted the working of businesses largely. Let’s dig in:

Illustrations

1. Changing Human Habits 

Visual communication overcomes the barrier of language and is, therefore, palatable to a larger audience. Compounded with the fact that in the current day and age the average person looks at their mobile 100 times a day, we have digital art as the single largest commander of attention span ever known to man. Illustrations are instrumental to this change. Today it’s all about storytelling and making an impact through visual design; let’s observe how illustration has morphed our communication:

Illustrations

Expressions

Today, we see a sort of resurgence of the archaic era wherein expressed emotions were preferred to their verbal form. Smiley faces and visual dialogue fill up a conversation more than actual words do. Ruled by emojis, stickers, and gifs, the expression has become extremely easy in online conversations. All of this is created by illustrations that practically experiment to provide the world with an endless plethora of options for creative communication.


Illustrations

Learnings

In a world as fast-paced as the one we live in today, hours spent reading have taken a backseat. Visuals summarize text to make learning faster and simpler, in a matter of seconds. Children’s storybooks or detailed infographics – visuals communicate it all. Digital illustrators are skilled in being able to depict all kinds of information through these visuals.


Illustrations

Entertainment

The gaming industry, cartoons, and movies have witnessed a major shift in the style and quality of the graphics and animations used. Each movie or TV series character we watch and fall in love with, from superheroes to sci-fi personalities, is shaped by a brilliant team of illustrators. The gaming world was taken by a storm with the introduction of PUBG, an online multiplayer game. The visuals used became widely popular owing to high quality and attention to detail, which can be completely attributed to the team of visual thinkers and artists that worked together to give the idea its shape and form.


2. Changing the Entrepreneurial Ecosystem

With changed human habits the way businesses operate and communicate has also changed dramatically.

Illustrations

Marketing

Illustrations are instrumental in the growth of the marketing industry. With the growth of users of depictive media, businesses have gone visual, and have created digital products. Graphic elements are being used to create strong brand recall through thought-provoking and memorable imagery, so as to enhance the success rate of the representation of products and services. Illustrations that stand out have the power to provoke consumer actions that result in conversions. Every advert performs the primary function of familiarizing the consumers with different facets of the product, however, only those that can appeal to human emotions can be rendered truly memorable. Therefore, graphic design and illustrations are the most effective for the cause. Visual advertisements in print (billboards, newspapers, magazines) or on digital platforms (social media, blogs, online publications) can truly compound the impact of good content and rake in revenue.


Illustrations

Data Visualization

The presentation of data in a pictorial format enables decision-makers to see analytics presented visually so that they can grasp difficult concepts or identify new patterns. Interactive visualization coupled with technology in the form of charts and graphs provides for insightful details to tell a compelling story. Combining illustrations, facts, and text, infographics are created to narrate a story, visually. From tech-intensive businesses to B2C businesses like Swiggy – everyone has taken to utilizing design and illustration to optimize their productivity.


Illustrations

Digital Branding, Customisation and Personalisation

With the constant evolution of technology, our business communications are also changing rapidly. We are looking into micro-level personalizations and interactions. Every business house today uses illustrations to be able to relate and emote with their target audience. A unique digital identity is created with the help of customized illustrations. Digital content heavily uses graphics for higher identifiability for the consumers. From simple icons to complex illustrations – skilled illustrators create them all, using many elements to personalize business communications.

Illustration Trends for 2019

Pop art as seen in the 1970s has been revisited extensively in design in 2018, introducing the world to new possibilities of visual communication. With creativity and visuals defining company values, companies are opting to strengthen customer interactions using pop art in digital design.

 

The bold and distinctive pop art illustration styles we explored, will be visible in web and mobile applications, games, movies, branding and advertising, e-cards, kindle, and much more. Packaging too has evolved to incorporate trendy designs and consumer trends.

Illustrations
Illustrations

1. The Comic Book Style

This style is typically composed of strong black outlines, realistic sketches of people and dramatically strong colors. The most influential element in this style, however, is the halftone pattern, which is a dotted texture used to depict light and shadows.

 

Application: It is most suited for usage in posters for marketing and advertising, and for storytelling applications such as e-comics, Kindle books, etc.


Illustrations
Illustrations

2. The Photo-Montage Style 

Using cutouts of separate images to compose a new picture, this style allows for different objects to assimilate into a whole new image! It can even make the use of magazine and newspaper clippings to allow contrasting elements to fuse into one unique image.

 

Application: It is mostly used in greeting cards, stationery products, and banners for branding and communication across digital and print platforms. It also has good use under ‘About Us’ section on websites.


Illustrations
Illustrations

3. The Glitch Effect

This effect is created by using duplicated images and placing them at different positions and angles. Different hues play with each other to create a kind of ‘glitchy’ interference. The glitch effect has a wide range of uses.

 

Application: Print media, gift wrappers, mobile wallpapers, and music albums, digital platforms with informal communication.


Illustrations
Illustrations

4. The Image-Illo Blender

A blend of photographs and illustrations, this style creatively helps in expression and exudes a contemporary aesthetic.

 

Application: It is used in album art design, website, and app design, branding, magazines, and fashion.


Conclusion

Storytelling is better told with visuals for higher engagement. Illustrations hold the attention of a reader and etch them into the reader’s memory for a long time to come. The illustration is one of the most important forms of visual communication: it informs and observes, delights and decorates, instructs and inspires. The future of pop art in the design world is bright and evolving, and 2019 is set to see it make a revolutionary come-back.

Article by Ghazal Qadri and Aakansha Menon, Illustrators at Lollypop Design Studio

There are two kinds of people in this world, people who love to read and people who don’t. Regardless, in this day and age, content is still the king. However, the great content is meaningless if not presented well. Today so much of web designs compromises of text and hitting the right mark for your typography and fonts is a key factor in the overall success of your site.

Digital is a very dynamic platform and we have to accept that the content keeps changing. Unlike print, web design doesn’t have the freedom to define the space between the letters.

Fonts have a deep psychological impact on your users and here is a list of 6 examples of great typography which are being used to create web designs around the world and are perfect examples that texts can never be boring!

1. Poppins

One of the Geometric sans serif typefaces and have been a popular design tool for building websites. Each letterform is nearly monolinear, with optical corrections applied to stroke joints where necessary to maintain an even typographic colour.

Lollypop - Web fonts

Recommended For: Modular and minimal websites
Use Case Examples:   www.zipl.pro   |   www.nerval.ch   |   www.theisbothmann.com   |   www.kikk.be
Source: Google Fonts
Font Link:  Download


2. Open Sans

Open sans would be a very good pair for many fonts like Raleway, Brandon Grotesk, Montserrat, Lato etc. It renders beautifully on the browser, with good readability.

Lollypop - Web fonts

Recommended For: Standard look & feeling, Corporate and Product websites
Use Case Examples:   
www.gravity-theme.site
Source: Google Fonts
Font Link: Download


3. Montserrat

This typeface comes in three variants and evokes the modernist style of the early 20th century, however, it feels less formal than, say, Futura. Montserrat really shines for short pieces of all caps and the geometric simplicity of the letters. In lowercase, Montserrat is still a pretty nice font with a nice large x-height and a lot more character than Arial or Helvetica.

Lollypop - Web fonts

Recommended For: Fun looking websites, it creates a majestic yet fun look.
Use Case Examples:
www.dangblast.com   |   hansonwu.com
Source:
Google Fonts
Font Link: Download


4. Playfair Display

It is a serif font with beautiful curves and well-rounded corners, which is suitable for both traditional, as well as modern websites. The design is influenced by typefaces from the mid to late eighteenth century, such as Baskerville. It makes an excellent font for titles and headlines (especially the beautiful italic), however, for long stretches of body copy, the delicate, high-contrast strokes might hinder readability, especially when used at smaller sizes.

Lollypop - Web fonts

Recommended For: It is basically the one that suits all and creates a feeling of trust. It can be used for modular as well as traditional sites.
Use Case Examples:  
wwww.adrien-heury.net   |   www.mondaymusic.es   |   www.craftedbygc.com   |    www.hoodzpahdesign.com
Source: Google Fonts
Font Link: Download


5. Avenir

The name Avenir means “Future” in French, and it is a minimal and modular sans-serif font used in many sites, which gives a futuristic look to the design. Use the bold and extra bold weights of Avenir for emphasis with the light, book, and medium weights.

Lollypop - Web fonts

Recommended For: Most suited for futuristic feeling. It resembles minimal, futuristic content, and creates clean looking product websites.
Use Case Examples:
  www.playcharms.com
Source: Web
Font Link: Download


6. Bebas Neue

It is a beautiful condensed looking font which looks very standard as well as stylish.

Lollypop - Web fonts

Recommended For: For standard yet solid and stylish layout feeling. It is a beautiful condensed looking font which looks very standard as well as stylish.
Use Case Examples:  
www.craftedbygc.com   |   www.theqcamera.com   |   www.ekpesbookclub.com
Source:
Web
Font Link: Download

Although typography isn’t as flashy as Animation or HD images, they are nonetheless, an integral and powerful part of every design. They can be bold, to draw attention to the messaging, or, subtle, to draw attention to other elements on the screen. In either case, one thing we all can agree on is that typography enhances the design as a whole, one way or another.

– article by Dhilip Kumar G., Lollypop Studio

When it comes to design, the first impression is always the last impression. Your users may like your website, but how do you make them fall in love with it?

All roads to this question leads to the human centered design approach where designs are created keeping the user in mind. Every designer worth his salt knows that appealing and practical interfaces helps their client reel in the users. Ideally an interface should be like a personal guide answering questions that users are looking for instantly without confusing them and thereby enhancing their experience.

And this is where Microinteractions come into play. They acknowledge the users and give them the necessary feedback in real-time by making them understand the current process, thereby making the interface more interactive. They are sort of omnipresent, they are everywhere, from turning off your mobile to loading a video. Maybe they can go unnoticed at times but one thing’s for sure: their proper use (or misuse) can make or break a product.

In the UX/UI world, although tiny, microinteractions are touted as the powerhouse when it comes with communicating with the user. Below are top seven microinteractions and their impact on user experience by Shiv Shankar, UI Designer, Lollypop Studio:

1. Swipe

The Swipe action eliminates tapping and is much more interactive and smooth. It helps the user quickly switch between the tabs and acquire more information about the product. Furthermore swiping is a very common gesture and guides the users subconsciously without making them think; just like we have been reading ‘Don’t make your users think’. What more? It’s insanely fun and addictive.


2. Data Input

All of us know the frustrations of setting up a password or creating an account. This action can easily raise hackles. While proactive suggestions on password strength and usage make it easy for the user to proceed ahead, some interactive interactions at the time of data input also keep users engaged with the process and help accomplish the goal.


3. Animations

Animation simply enables and improves micro-interactions. They personify good design; their presence might not be noticed but absence takes a toll on everyone. They act like a glue that helps designers make the simplest of processes interesting and addictive. But be very careful as they are meant to engage the users and not distract or frustrate them; delayed processing or introducing new style in the website might cause confusion.


4. Current System Status

It is essential to keep the user informed about the current status happening on a site or app. If the users are not informed chances are that they will get annoyed and close the site or app. Microinteractions lets the user know exactly what is going on, how long it will take the process to complete etc. Even failure messages can be humorous yet effective to retain the trust of a user.


5. Make Tutorials Interesting

Everybody is constantly seeking information, all of us. Tutorials with the help of microinteraction, guides the users about working of an application by simplifying and highlighting the basic features and important controls for easy understanding. that are important in function and required for further usage with fluidity.


6. Call to Action

Microinteractions essentially nudges the user to interact with an application or website. Call to action instils a feeling of achievement and also empathy factor in user behaviour and the best way to make your user interact with CTA is to make it engaging to entice the interest of the user.

Microinteractions

7. Animated Buttons

They play the role of information manager by letting the user know their way through your app or site. We need to pay attention to colour, shape, special effects, animations, placement and texture to make the user experience seamless.

We humans are hardwired to seek instant gratification. And it is a common tendency to overlook microinteractions in the greater scheme of things, but these are very important to get your users hooked.

Devil is in the detail- as everyone says. Small experiences and design features, like toggling between screens or highlighting a feature or popping off a new notification can make a huge difference in enhancing the user’s experience.

Every day at Lollypop we strive to improve the UX by making the UI less machine and more human. And Microinteractions definitely help us achieve this goal as they are after all designed with empathy and
users in mind!

– article by Shiv Shankar, UI Designer, Lollypop Studio