DEV Community: Sunit Shirke

Customize Android Studio UI

Sunit Shirke — Fri, 23 Apr 2021 13:40:07 +0000

This isn’t related to code or any other code-related aspect. It is just a fun article about customizing the look and feel of Android Studio IDE.

Let’s get started:

So if you have installed the latest version of Android Studio 4.0 (at the time of writing) you should have a UI which looks something like this:

First let’s install the Material Theme UI Plugin

File -> Settings -> Plugins

Vendor: Mallowigi

Restart the IDE

After it has been restarted you should either have a theme already applied or a custom setup page depending on whether you have installed it previously or not. Don’t worry, I’m going to mention the theme options which will mostly end up to be dark themes.

To choose a very dark theme go ahead in Tools -> Material Theme -> Material Theme Chooser -> Darker Theme

Similarly for the accent color too,

Tools -> Material Theme -> Accent Colors -> Fuschia Accent Color

Toggling Contrast On can amp up your color tones by a bit,

Tools -> Material Theme -> Panel Options-> Toggle Contrast

You can also change the arrow styles if you want from the panel,

Tools -> Material Theme -> Panel Options-> Arrow Styles

I use the Material Arrows styles which look like the ones below:

Below are some theme previews:

Atom Dark

Deep Ocean

Monokai

Oceanic

Darker Theme (with High Contrast toggled ON)

Here’s why design tools don’t matter!

Sunit Shirke — Sat, 17 Oct 2020 15:50:21 +0000

Creativity matters, the tool doesn’t!

Situation

UX designers defend design tools the same way fan bois defend tech companies and their products. The company doesn’t care if you support one or multiple products.
Design tools matter less than what you think. I came across some designers who asked me which tool I use for designing and I was greeted with this same response from more than half of them:

Why aren’t you using XYZ tool? It’s so good than ABC tool in terms of [some common features]. You should definitely switch!

Why?

Unless the tool limits you from either creating something, doesn’t support your device or genuinely lacks a feature which hinders your design pace you should be good to use pretty much any design tool which is commonly used.
When it finally struck me I thought of making an App UX design using 4 design tools. Technically, each of them aren’t design tools. Framer & Invision serve the purpose of a prototyping tool primarily but still can be used for designing the prototypes.

About

Don’t forget these are tools which are developed and maintained by big companies which don’t care about your opinion when adding/removing/changing a feature in their product. It means nothing is certain and if you stick to only one tool you might limit yourself to only the features which that tool offers.
Also, using a design tool isn’t a skill. It’s just good practice to display them in your portfolio to depict how strong you’re with the tool.

My Approach

View my UX Post here

The UX which I have attached above is from my Linkedin post where I had posted the initial release of the UX design.
Below are the links of all the design tools in which I have recreated the same UX. So, as it will be quite visible that design tools don’t matter if you have to create a complete UI/UX for an App/Website.

NOTE: I have excluded Sketch and other design tools because I haven’t used them personally so if I use them in future I’ll update the article.

Figma: https://www.figma.com/proto/0jotWkvhsEaXswDlcFQxvw/AppTest?node-id=3%3A2&viewport=336%2C193%2C0.4479730725288391&scaling=scale-down
Adobe Xd: https://xd.adobe.com/view/1a8a7198-2891-4b5b-ac25-c0adbed7479c-4fd9/?fullscreen
Framer: https://framer.com/share/AppTest--3oXvGdUL3WiWadumKcff
Invision: https://sunitshirke399831.invisionapp.com/console/share/HU1NFT328E/483961260

How do the “Giants” do it?

Companies or rather design teams can pretty much do anything from sticking to a particular tool to using many tools in their design process because they have a lot of things to factor in to create a great design like dev handoff, presentation features, access sharing, team collaboration, pricing and many more.

Conclusion

Stop depending on tools to be creative.
Always try everything and then choose a tool according to your use case or whatever suits you best.
Follow design principles.
Adapt to new design tools.
Keep on building your design knowledge from various sources.

The only tool which I don’t change for whiteboarding is Excalidraw which kind of serves the purpose of UX in a lighter way. It’s not a prototyping tool but definitely worth trying.

PS: You can follow companies like Zomato, Uber, Google for a good understanding of design principles.

A desperate mistake: Update README.md

Sunit Shirke — Sat, 03 Oct 2020 09:31:01 +0000

Contributing to open source projects is fun and easy.

Is it really?
For those familiar with GitHub and Open Source Contributions skip this paragraph and for those not familiar with either of them I’ll summarize it for you. GitHub is a big centralized platform where anyone can host their code/project for free and it uses Git for version control. It means an open source project is accessible to everyone and you can use the software according to your own needs. Now every project isn’t perfect in any way so developers from around the world try to fix any issues, create pull requests to commit their changes or add some of their own features to the project and this is how the project grows which eventually also helps the developer to showcase her/his contribution towards an open source project. Now that we have got that out of the way let’s focus on the issue at hand.

Recently I came across an initiative known as “Hacktoberfest” .

Hacktoberfest is a monthlong celebration of open source software run by DigitalOcean.

Honestly, it is a great initiative in my opinion because it encourages more contributions, more developer engagement and in turn a rapid growth of countless open source projects. Why is it any different from a weekly/monthly code marathon you ask?

To win a shirt, you must sign up on the Hacktoberfest site and make four pull requests on GitHub by October 31st. Pull requests do not have to be merged and accepted. As long as they’ve been opened and marked as ready-for-review between the beginning of October 1 and the very end of October 31, they count toward a free T-shirt.

So when it started on 1st October, 2020 some “contributors” watched how we can basically exploit this and win a free tshirt. The only problem here is that it was more of just writing docs updated or something which isn’t even relevant to the project. Teams at Hacktoberfest & GitHub had to include many measures for maintainers in order to stop this bulk spam. They’re handling this situation really well!

The screenshot above is an example of a spam pull request.

All I want to say to these spammy contributors is that contribute to a real project with your own logic and your own code! It’s not that hard. Just please don’t be so desperate for a t-shirt or for a badge. Heck it should at least make some sense.

Even tutorial code is fine but just writing something for the sake of +1 in PRs is just lame.

Informative legend for your PR contribution:

Credits: https://hacktoberfest.digitalocean.com/profile

If you want a video explanation of what I have just said, Pawan Kumar has posted about it on his YT channel:

To conclude, I’d like to say that enthusiastic devs will always contribute and in a good way. I sincerely hope that we share this information enough so that those who are new to the platform add something great to the community rather than getting sidelined because of not knowing enough about how to contribute.

Thanks for reading!

PS: Read the Hacktoberfest FAQs for any queries regarding open source.

How Media Query Is Going To Change Your Flutter App.

Sunit Shirke — Wed, 30 Sep 2020 18:06:15 +0000

Media Queries are an indispensable groundwork for responsive design.

Using it in web design has always been a good practice to ensure a reactive rendering of the layout & it's components.
Similarly, it plays a huge role in applications too because writing code & queries for every device's aspect ratio is not very efficient. A good usage of it will result in your release build ending up looking exactly like what you tested during development.
Luckily in Flutter we have MediaQuery that helps us in ensuring the padding & margin stay constant for every device layout. It is a great factor in reducing testing times for medium/big scale apps.

This is all it takes for the responsive magic ✨

horizontal: MediaQuery.of(context).size.width / 15,
vertical: MediaQuery.of(context).size.height / 15

To give you a perspective on the exact difference between an app using MediaQuery and the other not using it I have created 2 simple apps which have 6 containers each one having a different color separated by symmetric Padding Widget which has MediaQuery in both horizontal and vertical values making it dynamic according to each screen. Here are some screenshots:

6.5" screen (Model - Samsung Galaxy A51)

Without MediaQuery

Using MediaQuery

5.0" screen (Model - Motorola Moto G [3rd Gen])

Without MediaQuery

Using MediaQuery

Note that the screenshots containing MediaQuery look exactly the same even after a huge difference in screen sizes.

Thank you for reading!

Full code