6 ms·
Sing App – Open Source Admin Dashboard Template with Stylish Design
- d--b 8y agoWhy do all these dashboard app waste so much space? There's not a lot of info on that screen, and yet it doesn't fit in my laptop... I could fit 3 times as much in an Excel spreadsheet...
- retSava 8y agoMy pet peeve is low contrast, makes it really hard to quickly distinguish between parts of the page. Simply by changing the light grey background for something much darker makes the individual charts and boxes pop out, making it so much easier to compartmentalize the information. edit: https://imgur.com/a/2cUQAXr https://imgur.com/a/2cUQAXr
- dvfjsdhgfv 8y agoThe reason why designers don't do that is rooted in the modern guidelines advising against higher contrast as "bad style". That's why on many websites we need to read dark-grey text on light-grey background. Black and white are frowned upon in the UI design community.
- jdietrich 8y agoWhich guidelines? W3C's Web Content Accessibility Guidelines specifically recommend a minimum contrast ratio of 4.5:1. Most web style guidelines that I'm familiar with inherit this recommendation, including Material. https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-cont... https://material.io/design/usability/accessibility.html#color-contrast https://material.io/design/usability/accessibility.html#colo...
- jdietrich 8y agoWhitespace improves legibility. https://www.nngroup.com/articles/chunking/ https://www.nngroup.com/articles/chunking/
- thirdsun 8y ago> I could fit 3 times as much in an Excel spreadsheet... Which doesn't necessarily mean that it actually helps you to find the information or data you seek faster. Proper spacing is needed to separate groups of objects. However I agree that this dashboard template is simply not good, though spacing is one of the lesser concerns here.
- dsego 8y agoWashed out, thin fonts, horrible contrast. What's not to like?
- icemelt8 8y agoI have yet to find an admin theme which uses proper legible fonts.
- TomMarius 8y agoWhat fonts are good in your opinion?
- TheAceOfHearts 8y agoUse system fonts [0]. You cut down the total payload size, and the user will already be used to it. Focus on the data and content, instead of design masturbation. I swear, I don't understand this obsession so many people have with using custom fonts. One of the first things I do when I setup Firefox is disallow custom fonts. [0] https://css-tricks.com/snippets/css/system-font-stack/ https://css-tricks.com/snippets/css/system-font-stack/
- dmitriid 8y agoStandard system fonts
- TomMarius 8y agoWhat system? What standard fonts? My system has no standard fonts and I wouldn't want to use fixed-width fonts on a website anyways; I'd also be very unhappy if the website changed based on what device/system I'm using (I often don't have control over that device).
- HEHENE 8y agoWhile the documentation could use some work, Looper[0][1] has been working very well for us. There's not an obscene amount of wasted space, the fonts are legible, and it does a good job of adding useful features to Bootstrap without going overboard. [0] http://uselooper.com/ http://uselooper.com/ [1] https://themes.getbootstrap.com/product/looper-responsive-admin-template/ https://themes.getbootstrap.com/product/looper-responsive-ad...
- gregoriol 8y agoIs there a dark mode?
- giancarlostoro 8y agoIndeed my first thought. At least an option to toggle from light / dark mode as I've seen in other Bootstrap Admin UIs.
- distantsounds 8y agoYeah, somewhat odd creating a dashboard catering to sysadmins and not have a dark theme.
- vortico 8y agoI increased contrast, removed the nonsense drop shadows, decreased the global font size. https://i.imgur.com/r8CegSS.png https://i.imgur.com/r8CegSS.png Still far from perfect, but just wanted to see how easily I could recover this unfortunately nonfunctional design.
- nautilus12 8y agoOooooh burn!
- ainiriand 8y agoYeah still a bit more to do but definitely an improvement. Sorry to ask, but would you mind sharing this work with us? As a fork of the original?
- vortico 8y agoI'm not sure if I can, since I just edited some things in Web Inspector. I only changed the following though. - body color to black - removed all instances of "drop-shadow" - set backgrounds to white - reduce global font I would recommend further to - slightly reduce padding between boxes - use a font designed for the screen. This one might have been, but it is not as readable as certain other fonts. A principle in web design is that everything is rectangles, but you usually don't have to actually make the rectangles visible. The eye can usually make out the "boxes" of the page by glancing at the layout of the text.
- ainiriand 8y agoThanks for the hints, really appreciate it. I'm not that good with CSS nowadays.
- sandGorgon 8y agoVery very cool. I wish people built reactjs dashboard templates. I would literally throw money at it.
- dsego 8y agoAren't there plenty already? For example https://sigma.batchthemes.com https://sigma.batchthemes.com
- sandGorgon 8y agooh pretty cool. thanks for this!
- jeremyboom8 8y agohttp://creative-tim.com http://creative-tim.com has a bunch of decent dashboards
- armandososa 8y agoHmm. I could do that.How much money would that be valuable to you?
- midoreigh 8y agoAskHN: Which is your go-to free Admin Dashboard template?
- jtreminio 8y agoI have been building my FOSS using Tabler: https://tabler.github.io https://tabler.github.io
- tommoor 8y agolovely design on this one.
- Raymonf 8y agoWow, that looks really good.
- elvirs 8y agolooks neat. whats the terms if i wanted to use it for commercial purposes?
- deleted 8y ago[deleted]
- benoitg 8y agoLooks very neat! One drawback (as a user of admin themes), is that there is no list example, admin UIs are lists, lists, lists
- tommoor 8y agoHey @PhilipDaineko – just an FYI there are a number of spelling mistakes on the landing page, "custorem" "accountign"
- elvirs 8y agoas someone who is struggling to modify the sh.t out of metronic to make it look good and usable while fitting all needed information on the screen of our saas ecommerce app I have to say this design suffers from the same issue others do: little contrast between background color and text color as well as very thin font. my eyes hurt trying to look up a button or a link or trying to read text.
- ChankeyPathak 8y agoIn case you're looking for alternatives, this thread might be of some help: https://news.ycombinator.com/item?id=17241487 https://news.ycombinator.com/item?id=17241487
- bobbydreamer 8y agomdbootstrap has good samples and admin to has anybody used that.