My UI Review of 0.3.0Okay so most of you may know how vocal I am about UI, when it comes to Crypti. So I'm going to give a quick review/overview (not very in-depth) on the UI.
I have some very mixed feelings about the current UI. There are some areas where it looks terrific, but there are also some areas where it looks downright tacky. One of my favourite things about the UI is the fact that it is wholly based on Google's Material Design concept, which is a design style that I love. However in some areas the design style of the Crypti client has adhered to the Material Design Guidlelines strictly while in other areas it hasn't adhered to them at all.
The current UI doesn't feel well refined at all, nor does it feel consistent. Like I said there are some areas that you guys have nailed, like the Material Designed Modals, but other areas such as color palette, font choices, box shadows etc which ruin all the good work that has been done.
This is a quick overview of all the good and bad from the current UI. :
The Good :- Basic Material Design Guidelines are in Place
- Modals Look Terrific
- Design is fairly responsive
- Icons look great, and are relevant too.
- Animations are okay, could do with a bit more polishing, but still good enough
The Bad :- Font sizes off in many cases. In most cases the font size used is too large
- Very generic color palette
- Overuse of box-shadows (looks quite bad in some areas)
- Major inconsistencies in design, (at some points the design looks morphing between the flattish Material Design Guidelines and the gradient based design styles of yesteryear)
- Roboto, is the only font used. Roboto is a good typeface, but it shouldn't be used for everything here.
- Login page looks really bad, the background is literally a wallpaper shipped with Android Lollipop, with a very low-resolution
- Tables don't adhere to Material Design Guidelines at all. In fact the tables look like generic Bootstrap 3 ones.
My Solution: Well now I can't criticize any of this if I can't come up with a solution to the design problems myself. So I've tinkered around with the .CSS of the UI, and I've made a number of changes. I've mostly tried to recitify the issues I outlined above as well as try and improve on the design in any way I could.
Since I didn't have access to the app.css file locally, I had to make all of these changes through the browser, and I created a dump file with my new .CSS edits, which you guys can view here :
https://github.com/Wulfcastle/UI/blob/master/unpacked.css, however I made a few small edits (mainly to the Dashboard) after that which are in the screenshots below, however I couldn't save the edits as Chrome crashed. And again, remember this was a mere two hour hack-job, once we get our hand on the actual BETA client I'll try to tinker more with the CSS and UI.
You can can take the dump file of my .CSS edits and try and view it in your own browser to see the difference, but I haven't gotten it to work on my end, presumably due the way that Node.js applications handle the CSS rendering in the browser. So once we get to BETA test the actual client I'll distribute this my version of the UI for you guys to check.
Screenshots of my edited UI : Homepage with New Color Palette (I've had to remove the icons from the tabs/headers as the icons had a white background)Standard HomepageNew Login Page - Still not too proud ofSo let me know your feedback, I hope this was some good feedback to the team, and perhaps if the community agrees, maybe we could include some of my edits in the Client UI
So just to wrap up, I apologize if I've rambled a lot during this post, I've been extremely busy of late (hence the lesser activity on here), and this was just something I thought I had to share. To the team and community please take my views as constructive criticism (not as bashing or anything like that), the current UI is good, but it can be so much better.