Smashing Newsletter: Issue #69
Innovating, experimenting and challenging the status quo of design and technology leads us to come up with something original. That’s how the omnipresent parallax effect came into being in Web design. In fact, from the artistic point of view, single page parallax websites allow designers to squeeze in subtle details, dynamics and surprising perspective changes—all uncommon for most (non-Flash) websites. The Paris 3D Saga2 website is a good example of the visual effects and transitions that parallax websites can have.
The parallax effect can be useful when used properly, e.g. when wanting to showcase a product in 3D view on mobile. But since every other site uses some sort of parallax trickery for its layout, using the effect isn’t really exciting anymore. Most of them are so heavy that they could be called “monolithic”; visible from space, as dense as singularities. When a page takes minutes to load, and hence needs a loading or a splash page to keep users entertained, then something is terribly, terribly wrong with the design. Well, unless you can deliver the next-gen 10G connection to your users—too bad it doesn’t exist.
It’s time to stop building monstrous heavy parallax one-pagers. How about building a quick, heavily-optimized responsive website instead? Your users would surely appreciate it.
Stay curious and keep experimenting!
The Smashing Editorial Team
Table of Contents
01. Tilt-Controlled Images With Lenticular.js4
02. PHP The Right Way5
03. UI Inspiration For Android Designers6
04. Free eBook Platform For Indie Authors7
05. The Easy Way To Crop Images Online8
06. Free Interface Sketch Templates For Mobile9
07. Split, Merge And Mix PDF Documents Online10
08. Coverjunkie: Pictures Of The Past11
When designing for mobile, we often tend to forget about the capabilities that mobile devices often have — gyroscope and accelerometer are just a couple of them. But what can we do with them in our “regular” Web projects? Well, if you are designing an online shop with nifty product preview options, you might make use of tilting to display the 3D view of the item. Right… but now how would you build it?
If you are developing for the Web, the chances are high that you have to deal with PHP on a regular basis. However, once you’ve stumbled upon a problem that you have to solve, finding a good solution among thousands and thousands of (partly outdated) PHP tutorials out there can be quite a nightmare — especially if you are relatively new to PHP. Where would you go to learn about the current best practices in PHP?
Being a relatively young and extremely versatile mobile platform, Android poses many design challenges. Popular UI patterns on Android are often the common consideration in mobile projects. Because the Android platform is so fragmented, having a reference for the various emerging design patterns can be very helpful.
Of course, you can find common Android design patterns in the official Android Design Guidelines21, but if you are looking for something more specific, check out Android Niceties22. The website features a growing showcase of screenshots from beautiful Android apps and an insight into Android UI conventions. Android UX23 creates a library of the common Android design patterns as well. (vf)
It takes a lot of time and effort to write a book and it can be very troublesome to find a publisher for it. No less painful is the moment when the publisher takes a cut from the profit. A London-based startup discovered this very problem and created Payhip24, an online platform that allows you to quickly upload and sell your eBooks directly to your fans and followers. The service costs you absolutely nothing and your profit remains 100% yours. According to the creators, credit card details of the customers are never stored.
So how does it work? In order to setup your eBook page, simply upload your eBook file and add a name, description, price and thumbnail image. Your earnings can start from the moment when you share the link to this page. The service also includes a preview feature which allows you to upload a short preview as a teaser. At the moment customers can pay only via PayPal. Plans exist to add a few pro features that users can pay for if they want to, but the selling of the eBooks will remain free of cost. (ea)
Making a website look interesting and vibrant can hinge on nothing more than a well-chosen graphic that enhances the content. This makes image cropping such a delicate and sometimes time-consuming exercise. But what if you don’t have your desktop tools at hand? Developers from imagga have developed a tool to simplify the process.
The easy-to-use online auto-cropping tool Cropp.me27 suggests the right cropping based on the size you need. The tool even comes with predetermined sizes for common online image purposes. You just might save a lot of time. Gone are the times of desktop software to manually crop your images for the correct size! (jc)
Whether you are designing a website or an application, having printed templates for quick drawing, sketching or just experimentation is always handy. If you find yourself working on a mobile project, paper templates for the variety of mobile views can be great for quick prototyping of mobile user interfaces.
Interface Sketch29 is a free collection of simple templates that are designed to help you sketch your ideas on paper. The PDF templates are available in A4 and US Letter format for Web browser, iPad, iPhone 4, iPhone 5, Nexus 7 tablet, Android phone, Windows 8 phone and Feature phone. Each template has a variety of different horizontal and vertical views. Now, that’s a set worth downloading for your next projects! (vf)
We have all been there: you’ve received a large PDF file but you need just a couple of pages; or you’d like to merge the file with other documents to have everything in one place; or you have to send a large PDF file via email, and you just want to split it into smaller parts. The unfortunate thing is that you are on the go, and you don’t have your desktop tools with you. Or perhaps they don’t do exactly what you are after, anyhow. That’s where it would be fantastic to have an online tool taking care of your PDF nightmares quickly.
Sejda31 is just that: an advanced online PDF manipulation tool. At the moment you can encrypt, merge, rotate, mix and split PDF files by using pages or bookmarks. However, the developers are currently working on cropping, exporting, setting viewing preferences as well as splitting by size and text extract. The downside, of course, is that you have to upload the file to the server, so if it’s sensitive data, Sejda isn’t an option. However, for regular simple tasks, Sejda will definitely help out quickly and reliably. (vf)
National Geographic, Time, Rolling Stone — when we think of those magazines, what do we really remember? Well-researched, serious articles with subjects that are close to our heart? Sure! But what really grabs the busy person on their way to work and stops them dead at the newsstand is the cover. How many articles from these magazines have we forgotten? And yet, how many iconic images do we remember?
Browsing through the classic cover section of Coverjunkie33 is like time traveling. Here you’ll find the images that influenced generations — from National Geographic’s blue-eyed, Afghan girl captured during the very intense Cold War era, to Muhammad Ali’s Esquire showcase. From the tragic to the frivolous, these pictures evoke memories and feelings. So whether you are searching for inspiration or melancholia, be sure to spend some time on this website and you’ll come out ahead in some elated way. (jc)
The authors in this newsletter are: Esther Arends (ea), Jan Constantin (jc), Melanie Lang (ml), Talita Telma Stöckle (tts), Iris Lješnjanin (il), Vitaly Friedman (vf), Sven Lennartz (sl), Christiane Rosenberger (research), Elja Friedman (tools), John von Bergen (proofreading).
- 1 http://www.smashingmagazine.com/the-smashing-newsletter/
- 2 http://paris.3ds.com/en-index.html
- 3 http://paris.3ds.com/en-index.html#Restorations
- 4 #a1
- 5 #a2
- 6 #a3
- 7 #a4
- 8 #a5
- 9 #a6
- 10 #a7
- 11 #a8
- 12 http://lenticular.attasi.com
- 13 http://lenticular.attasi.com
- 14 http://www.phptherightway.com/
- 15 http://www.phptherightway.com
- 16 http://addyosmani.com/resources/essentialjsdesignpatterns/book/
- 17 http://jqfundamentals.com
- 19 http://jstherightway.com/
- 20 http://androidniceties.tumblr.com
- 21 http://developer.android.com/design/patterns/index.html
- 22 http://androidniceties.tumblr.com/
- 23 http://androidux.com/
- 24 https://payhip.com/
- 25 https://payhip.com/
- 26 http://cropp.me
- 28 http://interfacesketch.tumblr.com/
- 29 http://interfacesketch.tumblr.com/
- 30 http://sejda.com
- 31 http://sejda.com
- 32 http://www.coverjunkie.com/blog/classic-covers
- 33 http://www.coverjunkie.com/blog/classic-covers