Website for cars used to be bad, well some still are quite average, but there are some brands stepping up their web design game and creating truly beautiful experiences. Mixing motion, gorgeous imagery Mazda USA is a great example of this combination. Miles Cartwright the lead designer and art director shared some images and videos of the UI design on his Behance profile that definitely deserve the feature here. Mazda's Brand Essence is “Celebrate Driving”. “Celebrate Driving” delivered by Mazda is not just about driving performance. Choosing a Mazda prizes the owner with confidence and pride. Driving a Mazda leading up to urge to take on new challenges. Not just our products but every encounter with Mazda evokes the emotion of motion and makes customers' hearts beat with excitement. All of these are contained in our brand essence of “Celebrate Driving”. The project was created at Mirum with Lead Design and Art Direction of Miles Cartwright, Lead UX Design Eric Rulona, Associate Designers Junior Rivera and Creative Director Paul Drohan. UI design UI in motion
I was checking Dribbble yesterday when I saw this web design project for the surfer John John Florence. As a surfer and fan of the sport and of John John I decided to check it out in more details and I got amazed by the editorial style that the guys at Elegant Seagulls achieved on the design. The imagery and typography really makes it look like a real magazine. I don't know how that would work when we get to the responsive part of any web project, but they definitely got something going with this project, well done. Always aware of the top trends, but never trapping ourselves by them. John "John" Florence is a pro surfer known as one of the most dominant pipe surfers of this era. He is constantly pushing the boundaries of tube riding and aerial assaults. His progressive surf style helped inspire this concept's overall direction. Elegant Seagulls, a creative design agency located in Marquette, Michigan works one on one with every client to create websites, develop user interfaces/experiences, and build brands all while continuing our quest for world domination. For more information check out http://www.elegantseagulls.com/
We posted about Boosted Boards a few days ago, it's a great product and I see a lot of people moving around here in SF with those boards. Their website is also amazingly done. The work is from the talented folks at UENO but Robbin Cenijn shared some more details behind the Boosted Board Pre-order site. There's a lot to love, it's simple, elegant but for me what really sets it apart is the beautiful use of motion design. We selected a few screens here to share with you. Robbin started his career as a Motion Graphics Designer and after moving into digital animation as a Flash Designer with leading Dutch agency Born05 in Utrecht, The Netherlands, He was soon promoted to the role of Art Director. He has worked with great clients and produced award winning projects. Now he works at UENO in San Francisco. For more information and to see his full portfolio check out http://cargocollective.com/knottedlaces For more information about Boosted check out https://boostedboards.com/
Designing for the web has changed quite a lot since the mobile revolution and the introduction of tablets. We designers had to start thinking not only about screen resolutions, but also sizes, aspect ratios and how everything would work in synchrony. It's a challenge because you have to design something that works really well on a landscape aspect ration but also when checked on phones and tablets, the portrait version should also work equally well. There are great examples of sites that achieve that, the Make website created by Philippe Corthout and Make Antwerp is a good example. The homepage has a three column slot-machine-like scrolling action with items that link to various posts, portfolio items, tweets. The slots form a full screen image after a certain amount of scrolling, showing a different image each time it gets triggered. Make is an interactive and digital agency based in Antwerp, Belgium. The project is currently under development. For more information check out http://makemakes.be/
Motivation is probably the most important thing when we want to learn and improve our design skills. Actually not only the design skills, but every thing we want to do or become. Motivation drives us to overcome the barriers and keep moving forward. There are a lot of ways that people keep up with that, one is the daily projects. Lucas Berghoef decided to start a Daily Dose of Design 'Challenge', where he challenges himself to create at least one Dribbble shot every day next to his ongoing projects. I picked up some of the designs he has shared over the past month and it's awesome to see that variation of styles, typography and other things he has been exploring. It's indeed an inspiring effort and deserves to be featured here on ABDZ Lucas is a young passioned graphic designer currently working in Amsterdam, The Netherlands. He works as a freelance designer and he's always interested in collaborating with other passioned designers & agency's with fresh ideas. For more information check out http://www.lucasberghoef.com/
I have talked a lot about what I think the new trends of design for the web are. I shared a few projects that had some of the elements and styles that I believe are becoming the new trend in web design. On this post I want to share 5 projects that illustrate that better than words. You will notice that the grid is present but in a much more flexible way, things are not uniform, there's overlapping and motion design has a super important role.This projects are from designers from Dribbble, you can find out more about them by tapping on the images.
Simplicity never fails when it comes to design. Print, web, industrial design it does not matter the field, that is a goal every designer should have in mind to reach it. The Supra Footwear Website by Turuğshan Turna illustrates that very well with beautiful imagery and bold typography thanks to the classic look of AvantGarde and Futura fonts. Take a look after the break and let us know what you think. Turuğshan Turna is a Sr. Digital Art Director and UI/UX Designer from London, UK. For more information check out his work at https://dribbble.com/turugshan
It's awesome to see web design moving towards the editorial design and also how motion design has huge impact in todays design in general. The Herman Miller redesign concept is an awesome example of beautiful typography, imagery and of course subtle animations to create an elegant and engaging experience. About the project Herman Miller redesign concept, providing a highly immersive experience to the user from beginning to end by use of big imagery, quality content, bold typography, clean navigation and slick interactions. This direction could help evolve their eCommerce experience in an effort to drive better conversions. Motion Study This project was created by Rahul Bhosale and Jekin Gala. For more information check out https://www.behance.net/gallery/35756911/Herman-Miller
I love when designers are able to translate a classic editorial design to the web, even if it's just for static mocks. I understand that you might think, oh that cannot be fully done with the variant screens sizes, resolutions, responsiveness - you name it. The truth is, the only way to find out is by trying. I love designers that push the visual design exploration and seek inspiration from well-established concepts borrowed from the print world. The Q. Tarantino project is a great example and makes me want to redesign ABDZ once again. The designer behind this project is Lina Bo, a UI designer and illustrator from Barcelona, Spain. For more information check out https://www.behance.net/lina_bo
We talked and posted a lot of visual design references that we believe are the new trends for 2016. The Abduzeedo blog is a good example with some of the styles for typography, especially vertical orientation texts on the sides, a lot of white space and a non-uniform grid. Of course we are just a blog with a lot of constraints, including technical. That's the reason we posted about sites, magazines and books we used for reference. The project we share today wasn't used for reference but it could definitely be. Rock You is an online store, the official representative of Nike in the UK. It has bold typography and a very editorial design. For more information check out the Behance page for this project shared by Dmitry Kolesnikov.
Independent Brands, I feel there so many out there nowadays. Free from the outside and happily working without a hassle at making their own trademark which is a very good thing. The old days when only big brands were ruling are gone. Part of the brand process, one of the many crucial things to associate with to your product is your site. If your customers/target audience doesn't know what your product is all about after a few seconds then all your efforts are worthless at this point. Get your hands on with your users because it is more than a "Menu + Header Image + CTA" formula. It's about transcending your image/brand to the right customers. Farer.com Allbirds.com Nextbit.com Ratiocoffee.com Getrest.co Madera.com.au AliceAndWhittles.com Cbyge.com Marketplace by Invision MasterDynamic.com SheThinx.com Shop.FiftyThree.com Image Cover by Clark Street Mercantile: https://unsplash.com/photos/P3pI6xzovu0
Personal projects are always the best way to practice and evolve techniques. Since I started ABDZ I have been posting a lot of these types of projects, including my own. The interesting thing is that there are always some projects that people love to try and for some reason, the Logitech website is one of them. We feature a project last year and today we are featuring another one from Fatih Ocak. The cool thing about this project in my opinion is the simplicity and and typography. Some product sites usually focus a lot on huge hero images, like Apple for example, but his solution is a bit more minimal, there are images but they feel more blended with the content. Fatih Ocak is a UI & UX Designer from Istanbul, Turkey. For more information check out his Behance profile.
Translating design across multiple mediums is always a big challenge for even experienced designers. A solid branding system gives the flexibility and scalability to allow designers to carry over some design elements, the épuré – Fashion is a good example of that. The editorial design is strong and perfectly translated to the web. The project was created by Robert Gutmann, a graphic designer based in the south of Germany. Currently studying media design at the Offenburg University of Applied Sciences where he's just about to finish his bachelor thesis. Besides his studies he also works as a freelance graphic designer, Illustrator and Photographer on projects for various clients. You can check out his full portfolio at http://www.robert-gutmann.com/
I have been following the evolution of web design pretty closely over the last year always taking notes, bookmarking and looking for inspiration. It's crazy to think that a lot of sites became what Flash sites were in 2005. Many sites unfortunately rife with loading screens and animations that seem superfluous. However, there are things that really got better. Typography is much better and we're seeing sites with decently executed designs that resemble magazine layouts. For this post I'd like to share a Tumblr website design proposal created by Clément Pavageau (Watson DG) for Lucas Film to help showcase Star Wars Episode VII fan art. Lucas Film asked Watson DG to create a tumblr website showcasing Star Wars Episode VII fan art. Art Awakens is a fan-art competition in promotion of Star Wars : The Force Awakens. Amateurs and artists fans can submit their art for a chance to be featured in a professional art exhibit. - Rejected design
Serge Vasil shared a super cool project on his Behance profile, it was a responsive website project he did for Adobe and the best thing about it is that you can download the PSD for some Reverse engineering. There are so many things to like about the visual design, the grid, the typography and I also really like the tablet version. Take a look after the break and I hope that inspires you on this Superbowl Sunday. Serge is a Senior Visual and Product Designer with 12 years of extensive expertise in design for Creative Direction, Art Direction, Branding, UI/UX, Mobile, and Web. He likes crafting sophisticated and meaningful experiences as well as innovative digital projects.. For more information check out https://www.behance.net/vasege I'm excited to show you some new work for Adobe. This is a fully responsive website that illustrates and showcases Adobe Dreamweaver from the Adobe CC 2015 release. Download the PSD file
A great to exercise our skills and to evolve into better designers is daily practice. All the great names out there have practiced their skills and became people to look after. Hezy, a design group based in New York, started a 100 days challenge called "Daily UI Elements" in which they'll challenge you to design a certain piece of interface. Here are some examples of what they've done so far. You should really follow this project and make your own pieces as they challenge you daily. I hope you enjoy this! Keep evolving! Cheers. ;) Instruction and Choice of sport on Mobile Subscribe popup Promotional stickers Post view Homepage for a news website Test and Navigation for mobile app
Back to my posts about web design, UI and UX. Today I want to feature a project I saw on Pinterest titled Bandsøme and it's a web site for a modern furniture design store. The reason I felt so inclined to feature this site is because it has the major components that I believe will be the next trend in web design - Minimalist with nice typography touches like different orientation. Not to mention, the use of the International style grid. This project was created and share by Mustafa Çelik, a designer from Istambul, Turkey. With focus on typography, interaction and Ui design, Mustafa has put together a beautiful work for the Bandsøme. The challenges on implementing a interface like this would definitely put the design to test, nevertheless, it's an inspiring work. For more information check out https://www.behance.net/mustafacelik