large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

Published on <a href="http://ift.tt/2pEIphL">| Prototyping: From UX to Front End &mdash; Medium</a> Gray Hats <img alt="" src="http://ift.tt/2nWcOfQ">Courtesy of Unsplash Images
<h3>Icons</h3>
<blockquote>Great things are done by a series of small things brought together.</blockquote>
<img alt="" src="http://ift.tt/2qmhNqZ">Courtesy of Giphy Images
Icons define’s an apps content in an uniform way. Icons need to be light weight (.webp format) and easy to understand. If the app icons are flashy or too graphic and not respect to the present UI design trends. Then however good the app is, the user won’t be interested spending time on it.
I have been using these following websites for my daily icon usage when i design or develop any android app.
<ul>
<li><a href="http://ift.tt/2ebLqRZ">http://ift.tt/2ebLqRZ</a></li>
<li><a href="http://ift.tt/1bvZJd8">http://ift.tt/1bvZJd8</a></li>
</ul>
No matter an icon’s format (.png or .jpeg), you can always compress it by converting it into a WebP Image.
<a href="http://ift.tt/2mQL2w2">Create WebP Images | Android Studio</a>
To make an icon be compatible to all the devices you are aiming for from the tiniest phone to the largest tab on the market now. You can download an SVG document and add it in the drawable folder of your android app.
Like always my recommendation for a consistent and simple icon is :
<a href="http://ift.tt/2qmbIuD">Material icons &#8211; Material Design</a>
<blockquote>Hint : Can be used for web development too, just click on icon font 🙂 .</blockquote>
<h3>Animation</h3>
<blockquote>Animation offers a medium of story telling and visual entertainment which can bring pleasure and information to people of all ages everywhere in the world.</blockquote>
One such trend of 2017 is to use animation’s that will keep the user interested in the process of the animation and in the background the required processing takes place asynchronously.
<img alt="" src="http://ift.tt/2qWQHnl">Courtesy of Giphy Images
I usually load the online data from the <a href="http://ift.tt/10BjzeW">api</a> to my local database using these animations. This helps my app work in offline mode.
<pre>//AsyncTask&lt;Products, Products, Boolean&gt; class SaveIntoDatabase extends AsyncTask&lt;Products, Void, Void&gt; { @Override protected Void doInBackground(Products... params) { Products products = params[0]; try { if (!mDatabase.CheckIsDataAlreadyInDBorNot(products.getProductID(), products.getProductName(), products.getManufacturerID(), products.getManufacturerName())) { mDatabase.addProducts1(products.getProductID(), products.getProductName(), products.getManufacturerID(), products.getManufacturerName()); } } catch (Exception e) { Log.d(TAG, e.getMessage()); } return null; } @Override protected void onPreExecute() { super.onPreExecute(); } }</pre>
It can be hard to code animations for a particular widget in the android studio platform for a beginner. As the process is very tedious and the animation is not as flowing as it needs to be.
Most <a href="http://ift.tt/1Ua270m">MNCs</a> have multiple teams for an Android app development. The Design team comes up with great design and animations for any widget interaction in the application. BUT when it comes to the developers, they are caught up with lines of code just to make a animation work. This in turn increases the size of the app.
A great work around to make your app stand out and add all the animation that the designer have come up using After Effects or any animation tool is: <a href="http://ift.tt/2jYR8fh">LOTTIE</a> :).
Lottie is an open-source animation tool by the amazing folks at <a href="http://airbnb.com/">Airbnb</a>. Its an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.
<ul>
<li>Flexible After Effect Features</li>
<li>Manipulate your animation any way you like</li>
<li>Small file size.</li>
</ul>
<a href="http://ift.tt/2kSiMMH">Introducing Lottie</a>
Be part of the community.
<a href="http://ift.tt/2qm8E1A">LottieFiles &#8211; Free high quality Lottie animation files</a>
<blockquote>Hint: Now you can just ask the animation file from the designers and attach the json code to the android app. Thanks to <a href="http://ift.tt/1FnHQJv">Bodymovin</a> 🙂 .</blockquote>
<h3>Best 3rd party Android Libraries.</h3>
<blockquote>Android was intended to be very customizable. And we welcome innovations. -Sundar Pichai</blockquote>
You can find all the libraries on <a href="http://ift.tt/1t1QIBM">Android Arsenal</a>. But like always i will jolt down points of the libraries that change the way your app functions and performs.
<ul>
<li>Pull to refresh</li>
</ul>
<ol>
<li><a href="http://ift.tt/2armzZO">http://ift.tt/2armzZO</a></li>
<li><a href="http://ift.tt/2fgOMnP">http://ift.tt/2fgOMnP</a></li>
<li><a href="http://ift.tt/2qmjW5I">http://ift.tt/2qmjW5I</a></li>
<li><a href="http://ift.tt/2qX1tKb">http://ift.tt/2qX1tKb</a></li>
</ol>
<ul>
<li>Welcome slider</li>
</ul>
<ol>
<li><a href="http://ift.tt/2bWzDL1">http://ift.tt/2bWzDL1</a></li>
<li><a href="http://ift.tt/2aKtIIM">http://ift.tt/2aKtIIM</a></li>
<li><a href="http://ift.tt/2f2Y7Qv">http://ift.tt/2f2Y7Qv</a></li>
<li><a href="http://ift.tt/2qXlRuI">http://ift.tt/2qXlRuI</a></li>
</ol>
<ul>
<li>Navigation menu</li>
</ul>
<ol>
<li><a href="http://ift.tt/2oqr9gl">http://ift.tt/2oqr9gl</a></li>
<li><a href="http://ift.tt/2pSBtkH">http://ift.tt/2pSBtkH</a></li>
<li><a href="http://ift.tt/2dKnfwp">http://ift.tt/2dKnfwp</a></li>
<li><a href="http://ift.tt/2qWW6uy">http://ift.tt/2qWW6uy</a></li>
</ol>
<ul>
<li>UI/UX</li>
</ul>
<ol>
<li><a href="http://ift.tt/2qmns0f">http://ift.tt/2qmns0f</a></li>
<li><a href="http://ift.tt/2qXcLhB">http://ift.tt/2qXcLhB</a></li>
<li><a href="http://ift.tt/1Bs7AXP">http://ift.tt/1Bs7AXP</a></li>
<li><a href="http://ift.tt/2qX5vCl">http://ift.tt/2qX5vCl</a></li>
</ol>
<img alt="" src="http://ift.tt/2q9h0Z8">Courtesy of Giphy Images
<h3>Daily Read’s to be a better developer or designer.</h3>
<blockquote>You can’t wait for inspiration. You have to go after it with a club.</blockquote>
Here is a list of my daily inspirations:
<ul>
<li>Firstly, got to be <a href="http://ift.tt/2qWTT2g">Medium</a>.</li>
<li><a href="http://ift.tt/2qm9dZf">Hewlett-Packard Enterprise (TechBeacon)</a>.</li>
<li><a href="http://ift.tt/2hDwJfM">Android Blogs.</a></li>
<li><a href="http://airbnb.design/">Airbnb Design.</a></li>
<li><a href="http://ift.tt/2lnftdG">JustInMind Blogs.</a></li>
<li><a href="http://ift.tt/1gQxyaZ">Behnace.</a></li>
<li><a href="http://ift.tt/2ctGb2B">Uplabs.</a></li>
<li><a href="https://dribbble.com/">Dribble.</a></li>
<li><a href="http://ift.tt/1wE2U13">9-squares.</a></li>
<li><a href="http://ift.tt/2afDtxn">Motion Corpse.</a></li>
<li><a href="http://ift.tt/2fEUTEt">Animography.</a></li>
<li><a href="https://uimovement.com/">UI Movement.</a></li>
<li><a href="http://ift.tt/X95V1P">Design Your Way.</a></li>
</ul>
<img alt="" src="http://ift.tt/2qmoTvx">Courtesy of Giphy Images
<h4>Make sure to click ❤ and share this article. Just follow <a href="http://ift.tt/2qWMQqd">Gray Hats</a> for some more exciting content.</h4>
<img src="http://ift.tt/2qlVVf8" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="http://ift.tt/2q9xmkb">Keeping up with the Android .</a> was originally published in <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

Keeping up with the Android .

Keeping up with the Android .

Icons

Top Stories