Thursday, 25 August 2016

UI/UX Design Books & Blog Resources Recommended for Designers

Want to be an excellent designer? Looking for the best UI/UX books and resources? Nowhere to go or to gain the right and effective channel for becoming an outstanding UI/UX designer? Just follow me, I have compiled a list of high-profile UI/UX books, which are recommended by the major professional websites, and blogs.The topic is mainly covering UI design, UX design, and web design. Hope it is helpful and useful to you. Any resource you think it’s worth to be included, please feel free to give a message below the comment area or simply drop me a line on LinkedIn.

UX Books for Entry-level Designers

1.The Design of Everyday Things - By Donald A. Norman



It shows a teapot on the cover of the book, the teapot spout and the handle at the same side, if you tea, you are likely to burn yourself. What Norman want to tell you, the life is hard, often the "bad design" should be blamed. To learn interaction well, you must understand what’s the design requirements from people at first. As Steve Jobs said, “Design is not just what is looks like and feels like. Design is how it works.” The ultimate purpose of the designer is to make useful products, not just good-looking.

2.Don’t Make Me Think - By Steve Krug




"Characters of this book, the first one is short and pithy, 200-page length, not wordy at all. You may put it devoured on a noon, perhaps before going to sleep, even on the plane, or on your way to work. (It’s more likely to read through it on the love when you get the book) " Therein, which stresses the three laws of Web Usability, the first one is - do not let me think.


3.The Non-Designer's Design Book - By Robin Williams


Interaction designers must learn the basic knowledge of typography, no aesthetic, you can not be a good designer. In this ubiquitous creativity era, you have to make yourself be a designer.

In the eyes of Robin Williams, the design is quite simple. The book covers the four graphic design principles of C.R.A.P(Contrast, Repetition, Alignment, and Proximity), with concise, humor, and vivid language recounts the how much the changes and visible benefits brought by using these principles flexibly. In addition, it also introduces some basic knowledge about color and font, making the content more completely.


UX Books for Advanced Designers

1.
The Elements of User Experience - By Jesse James Garrett


If all you need is a book to teach you “how to design”, there are many, many books discuss how to build a website, but this one is not you wanted. If all you need is a book to tell you about technology, you can not find a line of code here. If you want to find an answer in this book, on the contrary, this book teaches you “how to ask the right questions.”

This book will tell you what you need to know in advance before you read other books. This book is for you, if you need a great concept, and if you need to understand the environment that user experience designers make decisions.




“If you are a young designer entering or contemplating entering the UX field this is a canonical book. If you are an organization that really needs to start grokking UX this book is also for you.”-- Chris Bernard.



Successful web design team relies on good communication between developers and customers, but also inseparable from communication within the development team members. Dan Brown will teach you through this book, wireframes, site maps, flow charts and other design established a common language. Through it, the designers and project teams can capture ideas, track progress and always allow stakeholders to know the latest  situation of the project.



As one of the must-read classic books, About Face series are worth the time to read, and each version is very valuable. As one of the instrumental books, AF brings interaction into the daily language of product design and development. Which is a comprehensive guide on interface design and interaction design of web and mobile devices. This book covers the best practices of project progress, goal-oriented design, persona development. For beginners who have no project experience, it may be very difficult, but still worth reading. We recommend cursory read at the first time and then study the rest part carefully when needed, because it involves too many details.

"If Norman is an old man telling stories, Krug is a crash expert let you simply entry design, while Cooper is a scholar, researcher, designer."


UX Websites & Blogs


Lukew, a senior UX expert on digital product leader who has designed and built software used by more than one billion people worldwide also the founder of several companies.



A comprehensive website provides high-quality articles with the UX employee on Design, Coding, Mobile, and Word Press etc.



A professional UX website. The difference between it and Smashing Magazine is that UXbooth focuses more on the aspect of user experience design.



It’s a new blog with very simple and clean interface, no more distraction from advertisements or others. Articles are all surrounding the topics of design tools, UI/UX design, web design, and mobile app design. A good design topic resource to follow.



About Author

Grace Jia
Prototyping tools, UI&UX news & information, article sharer, writer.
Email: grace@jongde.com 
Web: Mockplus

Wednesday, 24 August 2016

Top 20 UX Design Blogs and Resource Websites of 2016

The world of user experience and user interface has never stopped evolving and taken front stage where everyone seems to know about the buzzwords. It’s of utmost importance to stay up-to-date on the latest ideas and conversations happening in the industry, but the abundance of resources somehow makes it hard to find the truly helpful materials. That’s where blogs come in handy.

The following list collects some of the best blogs of 2016 on user experience and user interface design, providing a quick and easy way to remain current. Some of the picks are specially authored by only one blogger, while others pool the knowledge of industry experts and leaders. With no further ado and in no particular order, let’s get inspired in below.     

1. UI / Interfaces



These blogs display a plethora of tips, tricks as well as advice on how to create effective & user-attractive user interfaces. No matter building UIs for mobile apps, products or sites, the information included within those websites cannot miss out. 

a.   Dribbble (https://dribbble.com), a community of fellow designers to post and answer questions each day. It caters about design and showcases creativity almost from UI perspective.
b.   Behance (https://www.behance.net/), a great source of inspiration where traditional graphic design and high-quality design projects can be founded there. It’s not primarily iconography nor web/mobile UI.
c.   Site Inspire (https://www.siteinspire.com/), a website to provide web-based UI, with live snapshots and location of each website. There feature 2,500 websites searchable by subject, type, and style as well.
d.   Smashing Magazine (https://www.smashingmagazine.com/), a leading blog site providing resources and information related to the web design and development. It’s a go-to place when you need inspiration based on latest trends in development.
e.   Usability Post (http://usabilitypost.com/), a site that contains lots of web design and usability issues, along with great resources for trend predictions and project management.

2. UX/UI Strategy


Theses blogs feature a number of practical guidelines and techniques to be implemented on achieving design objectives or goals. The information varies from design ideas to project management methodology.

a.   Usability Geek (http://usabilitygeek.com/), a site focusing on the intersection between business and design, and you can discover plentiful articles regarding improving designing and conversions for business purpose.
b.   Medium (https://medium.com/), an excellent place to read, write and interact with the stories of fellow designers. It’s a vibrant online publishing platform, with thousands of new stories updated daily.
c.   Nielsen Norman Group (https://www.nngroup.com/) (NNG), the trusted authority in all things about UX, providing articles and reports related to user experience research. 
d.   Webcredible (http://www.webcredible.com/blog/), a London-based UX agency that collaborates with many brands worldwide to deliver award-winning work. The blogs contain UX articles and resources.

3. UX Design


These resource websites discuss the topic of UX design for both services and products, ranging from industry trends in UX field to reviews on tools and software for new practitioner and seasoned veteran.

a.   Awwwards (http://www.awwwards.com/), a site that awards the best of the best in mobile and web design. It’s where to find industry standards and stay relevant ahead of the curve.
b.   Mockplus (http://goo.gl/OHRk8L), the best selection of user experience/interface design and trend predictions blogs. All articles are hand-picked and well-written on how to output effective design works.
c.   Designmodo (http://designmodo.com/), another comprehensive website featuring both standard and obscure design topics, plus development, WordPress, tips & tutorials and much more.
d.   UX Myths (http://uxmyths.com/), a popular source of information for some common but untrue myths regarding UX design, by citing links, studies and facts to prove why those myths are false.
e.   UX Booth (http://www.uxbooth.com/), a leading publication for thorough UX topics, allowing readers to search content by sub-categories, such as Content Strategy and Information Architecture.
f.    UX Matters (http://www.uxmatters.com/), blogs here provide inspiration and insights into both professional who are working in all aspects of UX and newbies who are just stepping into the field.
g.   UX Movement (http://uxmovement.com/), a user experience blog which showcases how UI affects user behaviors. The concepts there are presented through visual examples.
h.   User Ability Stack Exchange (http://ux.stackexchange.com/), a question-and-answer website that is exclusively for UX design. Frank opinions from real-life experts can be discovered here.

4. UX Tools & Software


These sites feature topics regarding the newest software, UX tools, code snippets and many other items that are indispensable to one’s design arsenal. Also, those included resources are fundamental to stay updated on the greatest and latest design tools.

a.   Creative Bloq (http://www.creativebloq.com/), a widely-acknowledged website for UX information and article regarding the most current design tools. It’s possible to find several online magazines of general interest and worth scrolling.  
b.   Mockplus (http://goo.gl/OHRk8L), features useful software resources and information which include extensive tips on how to using their prototyping and wireframing platform Mockplus.
c.   Little Big Details (http://littlebigdetails.com/), a curated collection of design inspiration tips, updated on daily basis.
d.   Boxes and Arrows (http://boxesandarrows.com/), a provider of design principles, methods, processes as well as interfaces. The peer-written journal features an incredible range of posts related to software & hardware.
e.   UXPin (https://www.uxpin.com/studio/blog/), one of the web’s most popular blogs focusing on user experience from website perspective. There is plenty of resources for both hardware developers and designers.

5. UX Trends


These blogs are all about general movement, opinions and processes shared within the design community widely.

a.   Joshua Garity (http://www.joshuagarity.com/ ), a blog developed by a digital marketing consultant - Joshua Garity, offering design psychologies and strategies to boost conversion and revenue,
b.   52 Weeks of UX (http://52weeksofux.com/), a site containing timeless discussions around UX and UI, dozens of interesting tidbits can be found via digging through the archives on human behavior and design.
c.   Nilsen Norman Group (https://www.nngroup.com/), the comprehensive collection of groundbreaking research, UI evaluations and reporting done by Nielsen Norman Group.
d.   Usability Geek (http://usabilitygeek.com/), a go-to place for solid information from web’s foremost usability experts, with conversion related topics included meanwhile.

6. Book Reviews


Those websites give expert reviews on the most recent design publications, with an incredible range of design related resources yet to be found, including free UI/UX ebooks (http://goo.gl/kqngSD), digital guides as well as case studies.

a.   Luke W (http://www.lukew.com/), publications and reviews about product design, with bountiful materials for mobile and web design strategy by Luke Wroblewski.
b.   UX Mastery (http://uxmastery.com/resources/books/), a library of free UI/UX ebooks containing tools, degrees and conferences to a wide range of other online books.
c.   UX Mag (http://uxmag.com/), a one-stop resource for UX books and usability topics, providing a steady stream of design related materials.
d.   The IxD Library (http://theixdlibrary.com/), focusing on the best books, presentations as well as articles that are related to interaction designer. No general experience or usability information discussed here.

Wrap Up

These are just a few websites that I visit for my daily does of design inspiration. They could help us stay current on what’s happening in the design world, and stay relevant in the ever-changing industry. Hope you enjoyed this post and please comment below if I miss out your favorite one.

About Author
Berry Sarah
Enthusiast for developing prototyping tools, hoping to make friends with all like-minded guys around the world.
Email: bleachmizu@gmail.com


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 
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. 


Tuesday, 23 August 2016

8 Essential Design Tools For UX Newbies to Make Work Easier

As a UX designer, we will need to get familiar with the essentials of user experience, from user research to wireframing to collaboration to designing a final product. In this post I’m going to cover the UX design tools you’ll need for every aspect of your work as a UX designer, from beginning to end. Hopefully, it will simplify the way you work and make your lifer easier.

User Research

User Research focuses on understanding user behaviors, needs, and motivations through observation techniques, task analysis, and other feedback methodologies.
Surveys and questionnaires are great ways to gather information. 
Survey Tool: SurveyMonkey


SurveyMonkey is one of the best provider of survey software. There is a free version available with limitations, but the free version is still a very handy tool and allows up to 10 questions per survey. SurveyMonkey is pretty straightforward and fairly easy to use. It allows you to select from many pre-written questions. For basic surveys, I think SurveyMonkey is a great choice.

Usability Testing

Usability testing is a technique used in user-centered interaction design to evaluate a product by testing it on users. Usability testing is the best way to understand how real users experience your website or application.
 Usability Testing Tool: UserTesting


UserTesting is an online usability testing tool that allows to get videos of real people speaking their thoughts as they use websites, mobile apps and prototypes. The service works for landing pages, emails, ad, prototypes, live sites, and apps. You can opt to have your test designed by an experienced in-house research team, or have a project manager come on to oversee that you accomplish your goals.

Prototype Design

Wireframing tools make creating a website or application fundamentally easier. UX designers use wireframes and prototypes to create the products logic. It simplifies the communication between UX designers and clients and saves us much time on product development.
Rapid Prototyping Tool: Mockplus


Mockplus is an excellent tool to prototype app and website. It can be used to prototype for mobile, desktop and web apps quickly. Building an interactive prototype with Mockplus is much easier compared to an old prototyping tool like Axure or Justinmind. The intuitive drag-and-drop UI makes it possible to start using the tool immediately. Even the first-time users can master it without having to go over tutorials and training manuals. If you are looking for a UX tool that is cheap and allows to create interactive prototypes in a minimum of time, I recommend using Mockplus.

Collaboration

Communication is one of the critical skills of the UX designers. Want to improve communication with your team? Or work remotely but still stay in touch? That’s where collaboration tools come in.
Collaboration Tool: Red Pen


Red pen is a lightweight tool which lets you upload a file and share it with clients and team members for feedback. You can ask colleagues and clients for feedback by giving them a private link, or inviting them via email. It very easy for designers to get feedback and approve artwork in a professional manner.

Design Style Guides

Most projects can benefit from having a style guide. Using a design style guide ensures consistency throughout a project. Some style guides focus on specific topic areas such as graphic design, including typography. Website style guides cover a publication’s visual and technical aspects along with text.
Tool: Frontify


Frontify is a web design tool that helps designers create branding and style guides for their projects. The user can provide better documentation without wasting a lot of time on the process. An in-browser color picker is included along with an automatic color name proposal. What makes Frontify standout is that it is a place for itself by combining web design and development tools as well as a tidy, streamlined interface. Users can communicate quickly and gather valuable input easily.

Other Design Resource

Free Icons: iconfinder



Iconfinder is basically an icon search engine that anyone can use for free. According to Iconfinder, it now hosts the worlds largest collection of premium icons. It provides millions of beautiful icons to web designers and developers. All the icons are available to download for free in SVG, PNG, AI, or CSH. It is also an online marketplace for buying and selling premium icons.

Screen SpecificationsScreen Sizes


Screensiz is very helpful to quickly find the screen specifications of the most popular devices and monitors currently on the market.

Color PickerAdobe Color Wheel


Color selection can be one of the hardest parts of UX design, especially when you’ve just started. Adobe Color Wheel is an easy to use design tool. Upload a picture, you’re then given an accurate color palate. You can not only upload to the cloud, but can also pull your own themes, or themes created by others. This means that if you’re not feeling particularly inspired, you can have a look at themes that others have uploaded, pull one to your device, and adjust it to your tastes.

Conclusion

The primary purpose of using tools is to help us work more efficiently, so the faster you can master it the better. I hope these design tools will be helpful to you. Furthermore, there are plenty of other UX tools available, which may also be of interest. Feel free to leave any comments below.

About Author

Becky
Email: becky@jongde.com