Decentralizing SaidIt

submitted by JasonCarswell from infogalactic.com

sorted by:
top
newinsightfulfun
you are viewing a single comment's thread.

view the rest of the comments →

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

Cool! My only concern as far as integrating it in to the page is that the logo might be too tall to fit, but we can mess with that later

[–]JasonCarswell[S] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (15 children)

/u/magnora7 /u/d3rr

File page: https://infogalactic.com/info/File:Saidit.net_2019_Logo_Revision_Variants_Part_Two.svg

SVG file may display large in browser and may be scalable depending on your browser's capabilities: https://infogalactic.com/w/images/0/0a/Saidit.net_2019_Logo_Revision_Variants_Part_Two.svg

All these images will always be in a gallery on this page or linked from here (eventually on a new dedicated gallery page) : https://infogalactic.com/info/SaidIt

So all of the stuff on the left is old stuff with some tweaks to better illustrate some ideas that may or may not be relevant to the font design.

Down the middle are three columns. Variants on different "S" icons, taken to an extreme clipping at the bottom. The mid-mid column is the "dot net" from heaviest to lightest at the bottom (I just realized I hadn't considered lowercase). The mid-right is just inversed colours and reflected bubbles. None of these bubbles are different.

On the right are several more subtly different "S" as well as all the letters. Also the the "tail" moves around, in part defined by alignments with parts of the text, diagonally and vertically, and in part for variety if you have a preference. At the bottom is an ovoid, my favourite shape. I've done lots of work with that shape, and even based most of my 2001-2010 website on it. It might also make for nice red pill or black pill design.

I need a break because I've been looking and tweaking angles so much I can't tell what's good and what's not anymore - or if it even matters.

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

Thanks for so so many demos Carswell!

I've circled the one I think is best: https://i.imgur.com/lpjzhFd.png

I also modified it slightly to add a partial-crossbar on the A like we talked about. With my modification, I really like the way this one looks. /u/d3rr do you agree?

However I like the lighter ".net" of the very lowest and rightmost bubble on the page. The thicker fonts are just too fuzzy to easily read. So let's swap that out for the lighter one. I've also circled this in red.

I'd say we just pick this one, with those two modifications (half-bar across A, lighter .net font) and make an inverted colors version of that, and then stop trying alternatives.

Then we can try it out on the dev server to see how it look and fits in to the html and CSS. (d3rr, I just restarted the dev server last night and now it's working again after some sort of hardware failure).

Then we can modify more if necessary to get everything to come together. Then we can put it on the main server if it looks good.

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

Agreed. I like your A it reminds me of Arch Linux. The D is nice and easily recognizable.

I agree with the lighter .net part unless it is supposed to look like an exclamation point, like SaidIt! in which case bigger and darker might be better.

Also maybe the community wants to vote on switching logos, it could be fun.

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

Thanks! Glad you like my A. I think the .net is supposed to look like an exclamation point. I just want to make sure the .net is easily readable. Either way is probably fine.

We could get it down to 2 or 3 options, then bring it to the community to vote, sure why not. Maybe we could try a couple different colors.

[–]JasonCarswell[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (11 children)

/u/magnora7 /u/d3rr (I do this because only the person getting replied to receives notice. Corbett's site has an option to notify you for just responses, for all new comments on that post, or none, and maybe another. On Wikipedia you can get notified when any page on your watchlist changes. I'd like a default switch to change to be notified about all conversations I've participated on.)

Anyway. There's no wrong answer and backtracking is certainly an option. I say this because you've chosen the older style "S", which ties back to the current logo.

Also, the bubble tail on your selection is not on the right pointing to the right, but it is aligned to slice through the "I" and "D", and sort of asthetically reflects the "A".

I like your "A". I know I thought of it a couple times, but by the end I needed sleep. I'm kicking myself for not including it or some other variants like it.

Along the right column - the top two are the thickest "dot net", then the next two are the next thickest, again 2 of the third, and the last four examples are the thinnest bottom "dot net" which is shrunk down to 20%. I have one more thing I'll try for the "dot net" I think might improve it.

Thus far all of these designs are precise mathematical designs that all snap to a grid. I like the precision and math and all that crap so I often start there and will diverge when necessary. This case doesn't seem to require that. I mention this for posterity and future designers or coders that may wonder.

There are ways to increase or decrease the boldness or skinniness of the font. This would affect the mathematical "purity" which means it technically gets more complicated for anyone trying to replicated it but ultimately means nothing in pursuit of an aesthetic goal which should really be the only concern. I bring this up so you don't think I've neglected it, but also why I like this font width. Further the simplistic consistency is easily applied to other aspects. For example the bubble outline is a one unit width too. I will do variants on the bubble to show what I mean more.

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

I'd like a default switch to change to be notified about all conversations I've participated on.

Duuude bravo, that's totally a missing reddit feature. So I guess this means if you are person A and person B replies to you, and then person C replies to person B, you want a notificiation? Aka all comments that are a child of your comment should notify you if you opt-in to it.

I like one up from the bottom right, and 3 up from the bottom right, I guess the boring less styled ones. And the one magnora likes.

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

YES!!!

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

Alright, sounds great. Glad you like my "A". Looking forward to the bubble and .net variants

[–]JasonCarswell[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (7 children)

/u/magnora7 /u/d3rr

File page: https://infogalactic.com/info/File:Saidit.net_2019_Logo_Revision_Variants_Part_Three.svg

SVG file may display large in browser and may be scalable depending on your browser's capabilities: https://infogalactic.com/w/images/7/77/Saidit.net_2019_Logo_Revision_Variants_Part_Three.svg

This is Version Two with additions. The new stuff:

Middle column of "dot net" bottom one is a new adjustment and my fave. Above it is the old thin version. Beside it are 16x16 boxes with an "S" which might make for a good favicon.

The right column at the bottom has one moved to the right which is mostly copied for the blue/red pill versions. All 4 have the newest "dot net", different "T" and "S" as well

The bottom left cluster of six are all different. Of those 6 the top 2 and middle right are the old thin dot net while the bottom two and middle left feature my new fave dot net.

Of those 6 the left column are magnora7's last choice with slight variations to the "A". The top one has a higher cross bar, like the version to its right. The middle one has a lower crossbar which is harder to read, like the A to it's right. The bottom "A" has flat feet rather than the 45 degree slice. All of the crossbar slices are not 45 degrees but a copy of the A frame angle.

Of those 6 the right column top 2 are d3rr's choices.

Of those 6 the right column bottom 1 is almost my choice. With an "S" like the blue versions it might be. Also, I might like the "A" crossbar sliced. But this isn't about me.

I would have done more .net variants but I feel like I finally nailed it. Please don't hesitate to critique it though. I also ran out of space and got lazy so I didn't do as many versions as I prolly should have. And I didn't show what I mean by different bubble treatments.

Sleep.

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

Thanks, these look awesome. Sorry for the delayed reply. I'm going to have to think about which ones I like.

I think as far as the text, let's lock in the one on the left column, 3rd from the bottom. It's perfect. No more text variations please. If you could do a round-bubble version of that, plus the colors for that, then we'll start testing it out.

If you can make the grey background transparent, and cut the images down to their final small logo size, we can start testing them on the development server.

[–]JasonCarswell[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (5 children)

/u/magnora7 /u/d3rr

Comments encouraged if you see any way to improve any of these.

https://infogalactic.com/info/File:Saidit.net_2019_Logo_Revision_Variants_Part_Four.svg

I don't know what colours you'd like. I just picked some web safe colours to see if you thought the red pill thing was funny or worth exploring. (Web safe colours was an issue over 20 years ago. Makes me feel old.)

M7, you picked the "boxed" version of text in this "Part Four" and said it's perfect. However it had a slightly older different .net than my latest .net. To the right of the boxed version is a light blue version, also with the older .net. The rest of them are the newer version, like the 500% one.

Besides the .net all the texts are the same.

Besides the boxed version, all of the SaidIt bubbles are the same, aside from the oval and round ones. I added them just to be sure. I don't expect you'll want to explore those, but if you do I can.

The right-most two bubbles are a slight exploration into line width, should you choose to explore that. I should have done one without any outline. Also I should have done one like a drop shadow.

Like the 16x16 favicon boxes, I thought I'd explore the "S" alone a bit more. There's an "S" in a rounded bubble with most of the same proportions as the 9 below. In the 6 "S" group, the top 2 also share this height, but I've lost he tail. In the middle of those 6 I shrunk the height. For the "S" without the "aidIt" I prefer this tighter S-to-height ratio. Of the 6, the bottom right "S" in a circle is the same as the one above.

Of the "S" group 6, the bottom left is by far my favourite. I shrunk the tail to be more proportionate. It's also mathematically fit. This is my favourite ovoid shape of all time - a half circle, a square, and the other half of a circle - merged. Further the "S" (and all the letters except "I") fits perfectly in a square. Double that square and you get the height of the ovoid (except the tail) and if you triple that square you get the width of that ovoid. Mathematical balance. :)

Bonus:

I took the liberty of trying to make the graphic more clear. In doing so I also found I could tighten up the phrasology a little. Please lemme know if you'd like any changes, reversions, adjustments, or if I overlooked spelling typos.

I noticed one problem. The SVG files did not save out my carefully selected font. So the "detailed" SVG version is "broken" and the SVGs should be avoided until I replace them with a solution, outlines if necessary.

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Detailed.png

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Simple.png

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Simple_With_White_Outline.png

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Detailed.svg

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Simple.svg

https://infogalactic.com/info/File:The_Debate_Pyramid_v2_Simple_With_White_Outline.svg

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

Bottom right. I didn't see that coming. Then again I didn't know what you might prefer. I understand it though. The "S" is less aggressive, yet retains its points.

"A" crossbar is easy. I suppose I could have done more variations with more letters. I figured narrowing the dominant width of the "pyramid A" and removing the base for just a chevron "A" was enough not to be a pyramid, but I think you're correct to remove all doubt, not matter how remote - especially when it's so easy to.

I had some other fun ideas about the "A" that I was debating springing on you. Instead I'll tell you and you can tell me if you want to see a version. 1) Imagine the "A" on its side, like it's been knocked over, one side on the ground one foot in the air. 1a) Without the crossbar. 1b) With a crossbar. 2) Same as 1 but with the top section "beheaded" with a small top triangle removed from the rest of the "A" triangle. 2a) The "head" is flipped overlapping the feet of "I" and "D". 2b) The "head" is a pile of rubble at the feet of "I" and "D". 2c) The "head" is a pile of rubble resting on the bottom outline of the speech bubble. All of this is fun, perhaps good for banners about toppling power or for T-shirts - but I don't recommend it for a standard logo.

The top-left "D" is extended but the angles are different. I'll present several versions.

There is no res for a SVG but I take your meaning on the .net . And on reflection the exclamation point is not the point, though a clever device, the important part is that it says .net . It definitely needs tuning.

Being a SVG scalable vector graphic you can make it any size without compromising quality.