Saturday 27 August 2016
Wednesday 24 August 2016
Announcing the Google Play Indie Games Festival in San Francisco, Sept. 24
If you’re an indie game developer, you know that games are a powerful medium of expression of art, whimsy, and delight. Being on Google Play can help you reach over a billion users and build a successful, global business. That’s why we recently introduced programs, like the Indie Corner, to help more gamers discover your works of art.
To further celebrate and showcase the passion and innovation of indie game developers, we’re hosting the Google Play Indie Games Festival at the Terra Gallery in San Francisco, on September 24.
This is a great opportunity for you to showcase your indie title to the public, increase your network, and compete to win great prizes, such as Tango devices, free tickets for Google I/O 2017, and Google ad campaign support. Admission will be free and players will get the chance to play and vote on their favorites.
If you’re interested in showcasing your game, we’re accepting submissions now through August 14. We’ll then select high-quality games that are both innovative and fun for the festival. Submissions are open to US and Canadian developers with 15 or less full time staff. Only games published on or after January 1, 2016 or those to be published by December 31, 2016 are eligible. See complete rules.
We encourage virtual reality and augmented reality game submissions that use the Google VR SDK and the Tango Tablet Development Kit.
At the end of August, we’ll announce the group of indies to be featured at the festival.
You can learn more about the event here. We can’t wait to see what innovative and fun experiences you share with us!
Connecting your App to a Wi-Fi Device
With the growth of the Internet of Things, connecting Android applications to Wi-Fi enabled devices is becoming more and more common. Whether you’re building an app for a remote viewfinder, to set up a connected light bulb, or to control a quadcopter, if it’s Wi-Fi based you will need to connect to a hotspot that may not have Internet connectivity.
From Lollipop onwards the OS became a little more intelligent, allowing multiple network connections and not routing data to networks that don’t have Internet connectivity. That’s very useful for users as they don’t lose connectivity when they’re near Wi-Fis with captive portals. Data routing APIs were added for developers, so you can ensure that only the appropriate app traffic is routed over the Wi-Fi connection to the external device.
To make the APIs easier to understand, it is good to know that there are 3 sets of networks available to developers:
- WiFiManager#startScan returns a list of available Wi-Fi networks. They are primarily identified by SSID.
- WiFiManager#getConfiguredNetworks returns a list of the Wi-Fi networks configured on the device, also indexed by SSID, but they are not necessarily currently available.
- ConnectivityManager#getAllNetworks returns a list of networks that are being interacted with by the phone. This is necessary as from Lollipop onwards a device may be connected to multiple networks at once, Wi-Fi, LTE, Bluetooth, etc… The current state of each is available by calling ConnectivityManager#getNetworkInfo and is identified by a network ID.
In all versions of Android you start by scanning for available Wi-Fi networks with WiFiManager#startScan, iterate through theScanResults looking for the SSID of your external Wi-Fi device. Once you’ve found it you can check if it is already a configured network using WifiManager#getConfiguredNetworks and iterating through the WifiConfigurations returned, matching on SSID. It’s worth noting that the SSIDs of the configured networks are enclosed in double quotes, whilst the SSIDs returned inScanResults are not.
If your network is configured you can obtain the network ID from the WifiConfiguration object. Otherwise you can configure it using WifiManager#addNetwork and keep track of the network id that is returned.
To connect to the Wi-Fi network, register a BroadcastReceiver that listens forWifiManager.NETWORK_STATE_CHANGED_ACTION and then call WifiManager.enableNetwork (int netId, boolean disableOthers), passing in your network ID. The enableNetwork call disables all the other Wi-Fi access points for the next scan, locates the one you’ve requested and connects to it. When you receive the network broadcasts you can check withWifiManager#getConnectionInfo that you’re successfully connected to the correct network. But, on Lollipop and above, if that network doesn’t have internet connectivity network, requests will not be routed to it.
Routing network requests
To direct all the network requests from your app to an external Wi-Fi device, callConnectivityManager#setProcessDefaultNetwork on Lollipop devices, and on Marshmallow callConnectivityManager#bindProcessToNetwork instead, which is a direct API replacement. Note that these calls require android.permission.INTERNET; otherwise they will just return false.
Alternatively, if you’d like to route some of your app traffic to the Wi-Fi device and some to the Internet over the mobile network:
- For HTTP requests you can use Network#openConnection(java.net.URL), directly routing your request to this network.
- For low-level socket communication, open a socket and call Network#bindSocket(java.net.Socket), or alternatively use Network#getSocketFactory.
Now you can keep your users connected whilst they benefit from your innovative Wi-Fi enabled products.
Money Forward improves user engagement and ensures user security on Google Play
Money Forward, founded in Japan, allows you to manage your financial information from bank accounts, credit cards, through to loyalty points and bonds, all from a single app that is updated in real time. Learn how Money Forward increased user engagement using Material Design, and how they maintain user security on Android.
Android 6.0: What's New With Marshmallow?
While Apple takes much of the press in terms of smartphones, Android users are more numerous than their iOS counterparts. With the imminent release of yet another iPhone and iOS 9, you might wonder how Google will counter. Meet Android 6.0: Marshmallow. The following is everything you should know about the new Android operating system and how it stacks up against the best Apple has to offer.
Android Pay
While Android and iOS seem to only run in different directions, they do get drawn together by each other's innovations. Android has a slew of updates for Marshmallow that iPhone 6 users will already be familiar with, one of which is Android Pay. Although Google Wallet failed in its attempt, it was largely due in part to a lack of infrastructure. But the advent of Android Pay will see a much more comprehensive system, with many store owners and businesses already in possession of the electronic dock Android Pay will utilize.
Doze
One of the most sought after upgrades is extended battery life. With Doze, Android Marshmallow will stretch your smartphone's life considerably. Doze even knows when your phone is prone and face down, which enacts a battery save mode that extends your battery life. According to Digital Spy Doze doubles your smartphone's or tablet's battery life.
Google Now
Google Now is Google’s response to iOS's Siri. In Marshmallow, Google Now will be capable of far more thorough conversations. Phones like the Samsung Galaxy S6 Edge will even be able to understand context. Whether you’re texting with friends about dinner plans or talking with your significant other about movie times, Google Now will be listening and ready with suggestions.
Chrome
Chrome is not only faster and sleeker than ever before, but it also can monitor your Internet connection and limit the strain on your connection by cutting out superfluous content. For example, if your connection is bad, you may see blank boxes rather than intricate images while online. Chrome also sports a new Offline Mode, which comes in handy for saving websites you want to refer to later when Internet or cell data isn’t an option.
Google Photos
Google Photos has long been a subsidiary of Google Plus, but with Marshmallow, Google Photos will be its own beast. Google Photos will allow unlimited saved pictures of up to 16MB a piece and video of 1080p. This is a cloud service, so you won’t have to store photos or video on your phone and eat up its memory.
Now on Tap
With Now on Tap, Google Now works inside apps for a sleeker, faster and voice-controlled navigation process to super charge one of its most beloved features. Use Now on Tap by simply pressing and holding the screen until Google Now makes an educated guess at what will be the most helpful to you at the time. It works in accordance w
Appsdrop - The way to find quality apps
AppsDrop is a free Android app whose focus is to help users to install only good apps.
It is like a quality filter for Google Play. Google Play is not a bad search engine, but it provide so many results that it is difficult to compare them to find the best ones. Appsdrop doesn't have millions of apps; just the best ones according to their editors. This way is easy to discover and download interesting apps.
Using AppsDrop I found it easy to find apps as the design is quite similar to Google Play or App Store. Every app has an independent review by an editor so it is a bit better than the common developer review found in Google Play. Nevertheless, they don't have as many user reviews as the original market.
Apps are sorted in more than 300 categories, so it is easier to browse apps than in Google Play where they rely only on their search engine. And more than 8.000 apps has been reviewed by their team. So it seems an interesting app.
Whay I liked the most was their filtering options. You can select only free apps, recommended apps, new apps... I found interesting apps when I tested it. More common questions about AppsDrop. You should give it a try!
Why Your Ecommerce Store Needs a Mobile App
Ecommerce has become the mainstay of how a lot of people shop in today's world. Although the competition can be great, there are many methods you could develop that may set you above the competition. For example, targeting mobile devices has potential to enhance your overall sales income online. According to statistics, more than four out of five people prefer to use apps tailored for shopping over websites with responsive designs.
By the end of 2015, it's estimated that mobile commerce will account for more than $160 billion in sales around the world. Without an app to inspire customers to make a purchase, you may be losing out on some of that proverbial pie. Investing in a Mcommerce mobile app builder can help prevent the loss of sales from those customers. With more mobile devices activated every year, you may be losing out on sales the longer you wait. This means your competition is relishing in your inability to meet the demands of online shoppers.
ApksDrop - A market for quality Android apps
ApksDrop is a market of free quality apps for Android. It offers a selected group of thousands of apps hand picked by their staff. You can directly download its APK so it can be used as an alternative to Google Play.
As content is filtered by real people, there are few garbabe apps. Most of them seem to be useful. While Google Play has more than 1.000.000 apps, they have "only" around 8.000. They state that apps needs to be approved before being published in ApksDrop in order to assure a high quality apps market. Details about Apksdrop in PortalProgramas. One of the top features of this app is that reviews are independent, no more reviews by developers of the apps but by an editorial team. And you can read real pros and cons and what matters of each app.
In ApksDrop you can find apps by searching: they provide a search engine with lots of results. And you can also browse categories. This is a nice feature as just a bunch of app markets offers a real categories set. You have hundreds of categories available. You also have a "App of the day". It is not always a free app, sometimes it is just a featured app they think that people will love.
Here, location matters. It shows top apps within your country. So apps shown at US are different from apps shown at UK for example. This way we know what matters around us and it help us to discover apps which could be interesting only in our country such as restaurant apps, hotel booking...
Some peoples will be released in the next month. The most interesting one is an apps manager, where you can update all installed apps right from ApksDrops. A real alternative to any other app market. Management of apps will be really easy.
Tuesday 23 August 2016
Top Ten Front-End Design Rules For Developers
As front-end developers, our job is, essentially, to turn designs into reality via code. Understanding, and being competent in, design is an important component of that. Unfortunately, truly understanding front-end design is easier said than done. Coding and aesthetic design require some pretty different skill sets. Because of that, some front-end devs aren’t as proficient in the design aspect as they should be, and as a result, their work suffers.
My goal is to give you some easy-to-follow rules and concepts, from one front-end dev to another, that will help you go from start to finish of a project without messing up what your designers worked so hard on (or possibly even allowing you to design your own projects with decent results).
Of course, these rules won’t take you from bad to magnificent in the time it takes to read one article, but if you apply them to your work, they should make a big difference.
Do Stuff In A Graphics Program
It’s truly rare that you complete a project, and go from start to finish while maintaining every single aesthetic mutation in the design files. And, unfortunately, designers aren’t always around to run to for a quick fix.
Therefore, there always comes a point in any front-end job where you end up having to make some aesthetic-related tweaks. Whether it’s making the checkmark that shows when you check the checkbox, or making a page layout that the PSD missed, front-enders often end up handling these seemingly minor tasks. Naturally, in a perfect world this wouldn’t be the case, but I have yet to find a perfect world, hence we need to be flexible.
For these situations, you should always use a graphics program for mockups. I don’t care which tool you choose: Photoshop, Illustrator, Fireworks, GIMP, whatever. Just don’t just attempt to design from your code. Spend a minute launching a real graphics program and figuring out how it should look, then go to the code and make it happen. You may not be an expert designer, but you’ll still end up with better results.
Match the Design, Don’t Try To Beat It
Your job is not to impress with how unique your checkmark is; your job is to match it to the rest of the design.
Those without a lot of design experience can easily be tempted to leave their mark on the project with seemingly minor details. Please leave that to the designers.
Instead of asking “Does my checkmark look amazing?” you should be asking, “How well does my checkmark match the design?”
Your focus should always be on working with the design, not on trying to outdo it.
Typography Makes All the Difference
You’d be surprised to know how much of the end look of a design is influenced by typography. You’d be just as surprised to learn how much time designers spend on it. This is not a “pick-it-and-go” endeavor, some serious time and effort goes into it.
If you end up in a situation where you actually have to choose typography, you should spend a decent amount of time doing so. Go online and research good font pairings. Spend a few hours trying those pairings and making sure you end up with the best typography for the project.
If you’re working with a design, then make sure you follow the designer’s typography choices. This doesn’t just mean choosing the font, either. Pay attention to the line spacing, letter spacing, and so on. Don’t overlook how important it is to match the typography of the design.
Also, make sure you use the right fonts in the correct spot. If the designer uses Georgia for headers only and Open Sans for body, then you shouldn’t be using Georgia for body and Open Sans for headers. Typography can make or break aesthetics easily. Spend enough time making sure you are matching your designer’s typography. It will be time well spent.
Front-end Design Doesn’t Tolerate Tunnel Vision
You’ll probably be making small parts of the overall design.
An example I’ve been going with is making the checkmark for a design that includes custom checkboxes, without showing them checked. It’s important to remember that the parts you are making are small parts of an overall design. Make your checks as important as a checkmark on a page should look, no more, no less. Don’t get tunnel vision about your one little part and make it something it shouldn’t be.
In fact, a good technique for doing this is to take a screenshot of the program so far, or of the design files, and design within it, in the context in which it will be used. That way, you really see how it affects other design elements on the page, and whether it fits its role properly.
Relationships And Hierarchy
Pay special attention to how the design works with hierarchy. How close are the titles to the body of text? How far are they from the text above them? How does the designer seem to be indicating which elements/titles/text bodies are related and which aren’t? They’ll commonly do these things by boxing related content together, using varying white space to indicate relationships, using similar or contrasting colors to indicate related/unrelated content, and so on.
It’s your job to make sure that you recognize the ways in which the design accomplishes relationships and hierarchy and to make sure those concepts are reflected in the end product (including for content that was not specifically designed, and/or dynamic content). This is another area (like typography) where it pays to take extra time to make sure you’re doing a good job.
Be Picky About Whitespace And Alignment
This is a great tip for improving your designs and/or better implementing the designs of others: If the design seems to be using spacings of 20 units, 40 units, etc., then make sure every spacing is a multiple of 20 units.
This is a really drop-dead simple way for someone with no eye for aesthetics to make a significant improvement quickly. Make sure your elements are aligned down to the pixel, and that the spacing around every edge of every element is as uniform as possible. Where you can’t do that (such as places where you need extra space to indicate hierarchy), make them exact multiples of the spacing you’re using elsewhere, for example two times your default to create some separation, three times to create more, and so on.
A lot of devs achieve this for specific content in the design files, but when it comes to adding/editing content, or implementing dynamic content, the spacing can go all over the place because they didn’t truly understand what they were implementing.
Do your best to understand how the designer used whitespace and follow those concepts in your build. And yes, spend time on this. Once you think your work is done, go back and measure the spacing to ensure you have aligned and uniformly spaced everything as much as possible, then try out the code with lots of varying content to make sure it’s flexible.
If You Don’t Know What You’re Doing, Do Less
I’m not one of those people that thinks every project should use minimalist design, but if you’re not confident in your design chops and you need to add something, then less is more.
The designer took care of the main stuff; you only need to do minor fillers. If you’re not very good at design, then a good bet is to do as minimal amount as you can to make that element work. That way, you’re injecting less of your own design into the designer’s work, and affecting it as little as possible.
Let the designer’s work take center stage and let your work take the back seat.
Time Makes Fools Of Us All
I’ll tell you a secret about designers: 90 percent (or more) of what they actually put down on paper, or a Photoshop canvas, isn’t that great.
They discard far more than you ever see. It often takes many revisions and fiddling with a design to get it to the point where they’d even let the guy in the next cubicle see their work, never mind the actual client. You usually don’t go from a blank canvas to good design in one step; there’s a bunch iterations in between. People rarely make good work until they understand that and allow for it in their process.
So how do you implement this? One important method is taking time between versions. Work until it looks like something you like then put it away. Give it a few hours (leaving it overnight is even better), then open it up again and take a look. You’ll be amazed at how different it looks with fresh eyes. You’ll quickly pick out areas for improvement. They’ll be so clear you’ll wonder how you possibly missed them in the first place.
In fact, one of the better designers I’ve known takes this idea a lot further. He would start by making three different designs. Then, he’d wait at least 24 hours, look at them again and throw them all out and start from scratch on a fourth. Next, he’d allow a day between each iteration as it got better and better. Only when he opened it up one morning, and was totally happy, or at least, as close as a designer ever gets to totally happy, would he send it to the client. This was the process he used for every design he made, and it served him very well.
I don’t expect you to take it that far, but it does highlight how helpful time without “eyes on the design” can be. It’s an integral part of the design process and can make improvements in leaps and bounds.
Pixels Matter
You should do everything in your power to match the original design in your finished program, down to the last pixel.
In some areas you can’t be perfect. For example, your control over letter-spacing might not be quite as precise as that of the designer’s, and a CSS shadow might not exactly match a Photoshop one, but you should still attempt to get as close as possible. For many aspects of the design, you really can get pixel-perfect precision. Doing so can make a big difference in the end result. A pixel off here and there doesn’t seem like much, but it adds up and affects the overall aesthetic much more than you’d think. So keep an eye on it.
There are a number of [tools] that help you compare original designs to end results, or you can just take screenshots and paste them into the design file to compare each element as closely as possible. Just lay the screenshot over the design and make it semi-transparent so that you can see the differences. Then you know how much adjustment you have to make to get it spot on.
Get Feedback
It’s hard to gain an “eye for design.” It’s even harder to do it on your own. You should seek the input of othersto really see how you can make improvements.
I am not suggesting you grab your neighbor and ask for advice, I mean you should consult real designers and let them critique your work and offer suggestions.
It takes some bravery to do so, but in the end it is one of the most powerful things you can do to improve the project in the short-term, and to improve your skill level in the long run.
Even if all you have to fine tune is a simple checkmark, there are plenty of people willing to help you. Whether it’s a designer friend, or an online forum, seek out qualified people and get their feedback.
It may sound time consuming, and may cause friction between you and your designers, but in the big scheme of things, it’s worth it. Good front-end developers rely on valuable input from designers, even when it’s not something they like to hear.
Therefore, it’s vital to build and maintain a constructive relationship with your designers. You’re all in the same boat, so to get the best possible results you have to collaborate and communicate every step of the way. The investment in building bonds with your designers is well worth it, as it will help everyone do a better job and execute everything on time.
Conclusion
To summarize, here is a short list of design tips for front-end developers:
- Design in a graphics program. Don’t design from code, not even the small stuff.
- Match the design. Be conscious of the original design and don’t try to improve it, just match it.
- Typography is huge. The time you spend making sure it’s right should reflect its importance.
- Avoid tunnel vision. Make sure your additions stand out only as much as they should. They’re not more important just because you designed them.
- Relationships and hierarchy: Understand how they work in the design so that you can implement them properly.
- Whitespace and alignment are important. Make them accurate to the pixel and make them evenly throughout anything you add.
- If you’re not confident in your skills, then make your additions as minimally styled as you can.
- Take time between revisions. Come back later to see your design work with fresh eyes.
- Pixel-perfect implementation is important wherever possible.
- Be brave. Seek out experienced designers to critique your work.
Not every front-end developer is going to be a fantastic designer, but every front-end dev should at least becompetent in terms of design.
You need to understand enough about design concepts to identify what’s going on, and to properly apply the design to your end product. Sometimes, you can get away with blind copying if you’ve got a thorough designer (and if you’re detail oriented enough to truly copy it pixel for pixel).
However, in order to make large projects shine across many variations of content, you need some understanding of what’s going through the designer’s head. You don’t merely need to see what the design looks like, you need to know why it looks the way it does, and that way you can be mindful of technical and aesthetic limitations that will affect your job.
So, even as a front-end developer, part of your regular self-improvement should always include learning more about design.
Subscribe to:
Posts (Atom)