all 44 comments

[–]magnora7 20 insightful - 6 fun20 insightful - 5 fun21 insightful - 6 fun -  (28 children)

Yeah I have the same concern, it's hard to tell when insightful is activated. I think the lightbulb should turn yellow when it's upvoted, just like the face turns yellow when it's upvoted. Then it would be more clear when it's activated.

Other than that it's basically perfect. /u/enefi would it be possible to make this yellow addition to the activated insightful bulb icon and send the updated image to /u/d3rr ?

Overall the icons are a great improvement, they looks so clear compared to the old ones, nice work everyone!

[–][deleted] 8 insightful - 4 fun8 insightful - 3 fun9 insightful - 4 fun -  (9 children)

Yep I agree too. Yellowing the light when active is the best fix. I'll knock it out sometime soon.

[–][deleted] 5 insightful - 6 fun5 insightful - 5 fun6 insightful - 6 fun -  (4 children)

Can you make one bulb in a hundred flicker but only infrequently?

[–][deleted] 7 insightful - 7 fun7 insightful - 6 fun8 insightful - 7 fun -  (3 children)

I can ride my bike with no handlebars

[–]Questionable 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (2 children)

Yes, 2009 was a fun year.

[–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (1 child)

the 4:10 360 is my favorite. i don't know how his rims hold up.

[–]Questionable 2 insightful - 3 fun2 insightful - 2 fun3 insightful - 3 fun -  (0 children)

From the way he's needing to bang them out near the beginning of the video. I can safely say, they don't.

[–]bobbobbybob 4 insightful - 2 fun4 insightful - 1 fun5 insightful - 2 fun -  (0 children)

the dark theme is screwed, too. neither icon change, only a minor shift in grey in the background. I liked it when they had a major shift

[–][deleted]  (2 children)


    [–][deleted] 4 insightful - 4 fun4 insightful - 3 fun5 insightful - 4 fun -  (0 children)

    That feature is already implemented, go ahead and try it

    [–]Optimus85 2 insightful - 4 fun2 insightful - 3 fun3 insightful - 4 fun -  (0 children)

    I tried once but had to call 911.

    [–][deleted] 7 insightful - 3 fun7 insightful - 2 fun8 insightful - 3 fun -  (16 children)

    Update cc /u/enefi /u/theameliamay

    I can't color the bulb, that's too much art for me. But I was able to get svg icons in place. They look about equally blurry compared to the png versions, but in theory they could be better. Maybe they need less detail to focus on a rendering target of 25px wide.

    As for the voted and unvoted states, right now there's not a lot of contrast. Some ideas:

    • Alter the existing CSS background colors of div.arrow. unfortunately this covers both the button and the score that displays beneath it for post/link voting buttons
    • svgs with colored backgrounds depending on vote state, the old saidit approach*
    • voted and unvoted svgs edit: like enefi's new lit up bulb:
    • adding another div or span to hold just the vote icon, to more cleanly style it with CSS. I opt out of this, it's at least an 8 hour project requiring javascript changes. but I can guide anyone interested in going this far
    • Stop here and reflect amicably at how far we've come with these voting icons, in just 3 years!

    [–]enefi 5 insightful - 4 fun5 insightful - 3 fun6 insightful - 4 fun -  (4 children)

    They [svgs] look about equally blurry compared to the png versions

    If you have a system (scaling in OS/DE) and a browser set in a way, that it renders 1:1 (pixel size of the rendered image is same as virtual pixel size of a page in browser), then they should look pretty much same. But I think QHD, 4k and other higher resolutions on desktop are becoming more common; on mobile icons and graphical elements are usually bigger naturally. Maybe I could increase stroke width slightly (rays of a bulb look a bit thin/dark)?

    • Alter the existing CSS background colors of div.arrow. unfortunately this covers both the button and the score that displays beneath it for post/link voting buttons
    • svgs with colored backgrounds depending on vote state, the old saidit approach*
    • voted and unvoted svgs

    I think combining those approaches would work fairly well - a voting "box" (including score) changing background color and different on/off svg pictures.

    adding another div or span to hold just the vote icon, to more cleanly style it with CSS. I opt out of this, it's at least an 8 hour project requiring javascript changes. but I can guide anyone interested in going this far

    It's cleaner (personally I would use just img tag), but in itself it doesn't bring much value. Unless those svg files are inline (svg tag with all its data inside), I believe insides cannot be styled, meaning it cannot be animated (only inline svgs can be; either inserted directly to HTML by backend, or later by frontend).

    I am willing to donate more free time. I think making those static (non-animated) svgs shouldn't take too long, I'd guess 1-2 hours?

    I could try setting up local instance of saidit and try to integrate the animated icons, but a result is not guaranteed (I am not proficient in back-end stuff and never done anything in that templating thing which is used). That would most likely take much longer (because of the setup, I don't think the modification of styles and templates would take longer than 2-4h, I should be able to reuse a lot from the browser extension). But as I wrote earlier, I am not sure if admins/devs/users actually want those animations.

    I can't say when I could get to it, at soonest Thursday afternoon (CET), but more likely on the weekend.

    I would like to avoid an awkward situation of making something which in the end wouldn't get used. Can I get an official word on how should I proceed? (To be honest, I am not entirely sure who calls the shots, m7?)

    [–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (0 children)

    Good call enefi, the svgs look great on my phone with the higher ppi or whatever.

    The animated icons sound like they might be more trouble than they're worth. Getting an img tag added or any html change is a huge burden.

    Thanks for getting us this far. Yep, magnora7 is the shot caller.

    [–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (1 child)

    Also if you want to go an extra mile, the yellow of the lit bulb doesn't seem to match the yellow of the smiley face very well. A little more orangey for the bulb maybe. Maybe I'm wrong or drunk.

    [–]JasonCarswell 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (0 children)

    Fantastic work everyone! I knew you'd get there. Yesterday was dim, but today's looking bright.

    I've been hesitant to chime in too much, but now seeing that not only have the icons been improved and actually applied and whatever bugs were there have been figured out, I'm willing and keen to pitch my own improvements on the improvements for people to consider supporting, or not. I'd like to work from the current 4 or 8 SVGs if possible, and thanks!

    cc /u/enefi

    [–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

    Would you mind making a greyscale version of lol.svg if it's easy? I tried using an online convertor, but it changed the source code for the svg dramatically. Right now when you vote funny with fresh browser cache, you can see the icon jumping around.

    [–]Chipit 5 insightful - 3 fun5 insightful - 2 fun6 insightful - 3 fun -  (8 children)

    It's just, really really hard to tell if the button has been pressed or not. It's such a light shade difference between on and off.

    [–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (7 children)

    Agreed it's a big fail at the moment

    [–]magnora7 2 insightful - 3 fun2 insightful - 2 fun3 insightful - 3 fun -  (6 children)

    You probably already noticed this, but currently the comment voting buttons are different from the post voting buttons. The comment buttons are always showing the activated button images and don't change when clicked (except the CSS border). I guess that's the only other thing that needs updating besides the activated bulb having yellow in it

    [–][deleted] 3 insightful - 4 fun3 insightful - 3 fun4 insightful - 4 fun -  (5 children)

    The posts look like that too, for me.

    [–]magnora7 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (4 children)

    Oh they changed just recently again I guess, d3rr is updating them as we converse

    [–][deleted] 4 insightful - 3 fun4 insightful - 2 fun5 insightful - 3 fun -  (2 children)

    No, I think it's your cache. I haven't touched anything since last night. I'll make try to improve things in a couple of hours. If you have preferences about this stuff I'm all ears. I think I will add background to the SVG icons to match what we used to have, or just change the existing bg color that changes when voted.

    [–]magnora7 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (0 children)

    Yeah must've been my cache.

    I like the background of the button darkening, that's a nice improvement. If you had that, plus the images that change when you click them (including the lightbulb turning yellow when activated) I think it'd be perfect. I liked the gray images for unactivated, and yellow-containing images for activated buttons. This, plus the button background darkening like you have it, would be ideal to me.

    Not sure how doable that is, I know it's a ridiculously fickle system to configure, but that would be my preference

    [–]magnora7 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

    The current version looks fantastic. Well done.

    [–][deleted] 2 insightful - 2 fun2 insightful - 1 fun3 insightful - 2 fun -  (0 children)


    [–]magnora7 4 insightful - 3 fun4 insightful - 2 fun5 insightful - 3 fun -  (0 children)

    Nice work, I know these buttons are an absolute bitch to get right, I remember having a lot of difficulties with them when we changed them the first time

    [–][deleted] 2 insightful - 2 fun2 insightful - 1 fun3 insightful - 2 fun -  (0 children)


    [–]cryptEX 2 insightful - 2 fun2 insightful - 1 fun3 insightful - 2 fun -  (0 children)

    I guess you guys fixed it because it looks great on my phone.

    [–]Comatoast 5 insightful - 2 fun5 insightful - 1 fun6 insightful - 2 fun -  (1 child)

    Oh, shit-- everything is clear now. Thank you!

    [–][deleted] 4 insightful - 3 fun4 insightful - 2 fun5 insightful - 3 fun -  (0 children)

    They finally made them into SVGs, and it's lovely.

    [–]bobbobbybob 4 insightful - 2 fun4 insightful - 1 fun5 insightful - 2 fun -  (0 children)

    the dark theme has changed too, was that u/d3rr ?

    cannot see when either are clicked any more, there's a minor change to the background and that is it.

    [–]filbs111 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (1 child)

    Is this a recent change? I'm also having a hard time. I can tell by toggling and looking for the number to go up and down. Very hard to tell by looking. Seems like the background colour takes the same values as the alternating post background colours, which are presumably intended to be subtle, and can be imperceptible depending on your monitor, eyesight. I imagine this confusion increases the number of calls to "like" and "unlike", increasing load on the server.

    [–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

    They changed it back, this time with SVGs, but it still ain't perfect.

    [–]Zednix 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

    I just see the number change and that's it. Seems like a terrible design choice like new.reddit is aids.

    [–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (1 child)

    Now it feels like film noir.

    [–][deleted] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (0 children)

    Yeah lol

    [–]Questionable 2 insightful - 3 fun2 insightful - 2 fun3 insightful - 3 fun -  (5 children)

    How was this change implemented? By sadit, or a change in browser protocols?

    [–][deleted] 8 insightful - 4 fun8 insightful - 3 fun9 insightful - 4 fun -  (3 children)

    u/enefi made clearer icons, D3 just slapped em on. So, saidit.

    [–]bobbobbybob 4 insightful - 4 fun4 insightful - 3 fun5 insightful - 4 fun -  (2 children)

    dark mode fail

    [–]bobbobbybob 1 insightful - 2 fun1 insightful - 1 fun2 insightful - 2 fun -  (1 child)

    u/enefi dark mode is now horrible.

    Is there an option to have the old icons and clicl response back in dark more? the light bulb looks like a glowing pisshole, and the unclicked face looks like someone dying. they were nice before these changes

    [–]enefi 4 insightful - 3 fun4 insightful - 2 fun5 insightful - 3 fun -  (0 children)

    I am sorry, but I am only the author of the images (in their base form, they both have color), not those css styles currently being used. I made one newer attempt with animations and I used grayscale in off state, because the effect was already used on the site and I thought it looks kinda good (you can see at a first glance if you have voted just by the yellow). I believe d3rr is still working on the styles.

    [–]Optimus85 2 insightful - 2 fun2 insightful - 1 fun3 insightful - 2 fun -  (1 child)

    The icons look very sharp on a 4K display but there needs to be two different icons for insightful and fun. Monochrome when not upvoted and colour when upvoted. Edit: Duh. They're vectorial. They do scale great though.

    [–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

    They just changed the icons to SVGs