Ever found yourself stuck in a mall waiting and you noticed an interactive digital directory to toy with? Instead of actually trying to find a location, you end up just fiddling with the UI to test its functionalities and response time. You’re not the only one, welcome to the group! We’ve found ourselves doing the exact same thing.
Codrops has come out with an attractive Interactive 3D Mall Map. We fell in love with this immediately due to it’s clean visuals and smooth transitions, definitely something to take a look at.
Take note however, the writer Mary Lou has mentioned that:
This is a highly experimental proof-of-concept. 3D and viewport units support is needed for this to work.
Check out the post Check out the demo
Have you tried out Ionic yet? If you haven’t, check out our previous post on Getting Started With Ionic to get a head start in hybrid mobile app development. This time around, we took the liberty to find out what this versatile framework offers as a service to its framework.
Transitions maketh Interaction. Any website or mobile application without any transition would seem dull. The complexity of transitions can be as simple as a fade-in effect to something complex like the Call of Duty: Ghost loading UI Interface . Here’s an Ink transition inspired by Sevenhills, Claudia Romano has said :
“By using a PNG sprite and the steps() timing function in CSS, we can create video effects and use them as transitions”.
So what are you waiting for? Hop on the Transition train for a better future! Hola us for any ideas and comments on transitions!
See how it’s done Checkout the demo
Along with trying to create an open standard for virtual reality, Mozilla has created a Web Component-based solution for creating 3D visualizations: A-Frame. The community for A-Frame have done a great job making the 3D experience easy for yet visually powerful.
Read more about Mozilla and VR
Brackets is a free open-source source code editor made for web designers and front-end web developers. By default it comes packed with useful features but can be enhanced even further with the correct extensions.
What are these extensions?
Ink (also called Foundation for Emails) is a HTML email development framework that is built around the best email practices. In the era of smartphones, people are frequently checking their emails on their mobile devices and that means the need for a responsive approach to emails.
Enter Foundation for Emails 2, Ink’s successor. This upgraded framework is mobile-ready and allows developers to quickly create responsive emails that work (even on problematic email software like Outlook). Developed in 2015, this new version focuses on quicker layouts, colors and styles. Foundation for Emails 2 borrows many components, best practices, and workflows from Foundation for Sites. Foundation developers new to HTML emails will feel right at home with this..
More details on 2.0
Flexbox (Flexible Box) is a method that aims to provide a more efficient way to build powerful dynamic layouts by efficiently laying out, aligning and distributing space among items in a container. It can be implemented on all sorts of modules but is best on smaller sized web apps.
If you ever needed it applied on a comments section of your website, here’s a detailed explanation on how it can be done.
For those who code, commenting is an important practice to always keep in mind. It’s useful for flagging issues or labeling certain areas of code so that yourself and other developers will know what’s going on with the code. It is not uncommon for developers to inherit someone else’ code from years before. This article will test how well you’ve been commenting thus far.
How Good Are My Comments?
Ionic is also a completely free and open-source framework which makes use of AngularJS for creating highly interactive apps. All you need to do is install the node and get started.
Let’s build some mobile apps!
If you think you know HTML and have a good handle on modern web standards, you should try this 15 HTML questions challenge by Alexander Dawson from sixrevisions. The questions will test your familiarity and understanding of HTML5 as well as related markup languages like XML and microformats. There is no time limit and score-tracking for this challenge, so take your time. Hit the button below to accept the challenge.