24
votes
$\begingroup$

Edit 22 June 2016

I will add more realistic icons and tweak the design to match more an aviation map. Thanks for your feedback.


EDIT 21 JUNE 2016

Thanks for your feedback! I went through all of it a couple of times trying to define what should and shouldn't be done.

Don't touch anything that's in red. Everything that's red is red for a reason.

I kind of agree and disagree here, I can see that people don't want to press a red button because it usually means danger, but I don't think we can apply that to all logos (and I tried several color for the logo, trust me, red is the best choice). That said, I did update the site buttons to blue instead of red. We won't have red buttons anymore but I'd argue to keep the logo as it is.

The abstract map

I know that one is difficult. It's an abstract map so it doesn't use real references by definition, but it seems like it bothers some of you a little. Some also said that it looks more like a constellation, so I tried to follow Kevin's suggestion while keeping the abstract style. I think we have a good comprise here. I know some of you would like to add more realistic icons, but please remember: it's an abstract map :).

Home v2


I'm Stéphane, a senior product designer at Stack Exchange. This community went through the first phase of graduation back in Nov. 2015 and now we're ready to give you the second phase; a unique crafted site design and increase in the amount of reputation needed to access each privilege. I know this site already graduated, but I'll say it again...

Congratulations!


Design concept

Even though we already had a design mockup well accepted by the community, I decided to improve it a little.

The logo

On one hand, we wanted the logo to contain references to real aviation objects or instruments, and on the other hand we also wanted it to be unique.

To do so, I combined an attitude indicator and a pair of wings to create an icon that could stand on its own.

Logo explanation

Logo

The branding

The branding around the logo is an abstract interpretation of aviation maps.

Poster

The site

Home

Badges

Zoom header


We believe the design and branding will work well for this community, that it's unique, and captures the correct mood. We’d love to hear your feedback, and if there are no major design changes, we’ll launch the new design and increase the site's required rep levels for privileges.

Thank you for for making this such a great community!

$\endgroup$
13
  • 7
    $\begingroup$ Thanks for your work on this, great concepts! Were you planning on doing anything special with the voting arrows? We had some ideas of using aircraft planforms a while back. $\endgroup$
    – fooot
    Commented Jun 20, 2016 at 19:36
  • $\begingroup$ @fooot We're not customizing arrows anymore, it's not scalable, we're just customizing the color now :). $\endgroup$
    – Stéphane
    Commented Jun 21, 2016 at 14:55
  • 1
    $\begingroup$ Oh a pity! I was referencing programmers.SE and hoped we'd get some customization like that. $\endgroup$
    – kevin
    Commented Jun 21, 2016 at 16:45
  • $\begingroup$ Definitely feeling the edited version :) $\endgroup$
    – voretaq7
    Commented Jun 22, 2016 at 2:00
  • 3
    $\begingroup$ I think we understand that it's your idea of an abstract map. But abstraction should at least evoke the concept of the abstracted object/concept. And what we may not be expressing very well here is that, for most pilots, the abstraction you have created does not evoke an aeronautical map...it evokes either nothing or perhaps a constellation. Bret has a good idea though, I think with a little work with him an abstract map concept can be concocted that leaves everyone happy. $\endgroup$
    – Jae Carr
    Commented Jun 22, 2016 at 6:38
  • 2
    $\begingroup$ I really like the design so far, but I agree with the comments on the map. I think the challenge with the abstraction of the map are caused by the fact that an aviation map is already an abstraction in itself. The symbols for VOR, NDB, DME, VORDME, VORTAC TACAN, intersections, airspace classification etc. make the map an aviation map the moment you put your eye on it. Without these symbols it becomes like any generic abstract map and therefor abstractions without these symbols are not an appealing solution for this site. $\endgroup$
    – DeltaLima Mod
    Commented Jun 24, 2016 at 10:51
  • 2
    $\begingroup$ How about we change the "Help" button to "7700"? :D $\endgroup$ Commented Jun 29, 2016 at 18:36
  • 1
    $\begingroup$ @SMSvonderTann I know you were probably joking, but really, let's please not do anything like that funny. The people who most need the help button are unlikely to have any idea what the significance of 7700 is, let alone actually make the connection between that and the concept of receiving some kind of assistance. $\endgroup$
    – user
    Commented Jun 30, 2016 at 10:55
  • $\begingroup$ @Stéphane Does it HAVE to be an abstract map? I am getting the impression that this is somewhat a requirement, but I don't understand why that would be? I would use kevin's draft 1:1 to be honest, this really is aviation at its' core. I also agree with what others have said: Stay away from red! I also second the statements made in other answers that red should not be used in the logo. $\endgroup$ Commented Jun 30, 2016 at 12:17
  • $\begingroup$ The airplane badges are awesome. $\endgroup$ Commented Jul 1, 2016 at 16:29
  • 1
    $\begingroup$ Thanks for the great work. I just notice the new design. I would like to express my opinion a bit. I feel the unread question blue is too bright. If we could tone that down a bit would be great. $\endgroup$
    – vasin1987
    Commented Jul 1, 2016 at 17:21
  • 3
    $\begingroup$ Sorry to add a comment later. But I feel that inactive vote buttons could use diimmer tone than activated vote button. It feels much better to see a button I click glows up than the other way round. $\endgroup$
    – vasin1987
    Commented Jul 1, 2016 at 20:10
  • $\begingroup$ I'll be honest: I first saw the new logo of Aviation.SE when I got +10 rep a few days back. When I clicked on the green +10 to see what site I got it from, I saw red lips, and for a fleeting moment wondered when had I ever signed up to Kiss.SE. Turned out it was Aviation.SE's new logo, highly scaled down. Its red colour and shape evoke neither attitude instrument nor wings, at all (it's more like a red caduceus symbol). I am still surprised when I see it, several days afterwards. If the logo were silver- or grey-coloured (or its wings more stylized, or both), it would be far more appropriate. $\endgroup$ Commented Jul 3, 2016 at 7:07

9 Answers 9

22
votes
$\begingroup$

Comments on June 21st Edit:

You're going to hate me, but I actually think the updated design looks more like a constellation. For example, Taurus:

enter image description here
Image source

Especially with the symbols that were unique to aviation (VORTAC and airport) removed, there's really nothing about it that strikes me as aviation-related. If I had to pick between the old and the new versions, I would pick the old.

I still think that a hub and spokes design would convey the "abstract aviation map" better because it would more resemble a real map. To demonstrate what I mean, I put together a real quick and dumb example by basically tracing this part of a real chart and then simplifying. It came out like this:

enter image description here

I don't know how others feel, but that screams "aviation chart" to me, and doesn't say "constellation" at all. I initially was an advocate of the triangle intersections, but in this version, they just felt like unnecessary noise. They're the least aviation-specific of the symbols, and therefore the least interesting. After a conversation in chat, I also threw in a VOR/DME instead of just VORTAC's; partly to mix it up, and partly to acknowledge that VORTAC's are fairly US-centric, whereas VOR/DME's are more common worldwide.

Anyway, that's my two cents as a community member.


Original Post:

Stéphane is probably really tired of hearing my (sometimes contradictory) opinions, but, since it's been posted publicly now, I thought I'd share my thoughts openly as a community member.

First, I really love the overall design concept. I think it would have been easy to fall into the cliche of a cartoon biplane or a 747 which would not be very representative of our community. Instead, the wings in the logo well represent both winged aircraft and the pilots who fly them. The center being an abstract attitude indicator further says "this site isn't travel or airliners.net, it's for people who fly, design, or work on aircraft". Even some non-fixed-winged aircraft (like helicopters) have attitude indicators, which makes its representation of the community more inclusive. In summary, I think the logo is perfect.

I personally like the color choices. I know some people have objected to the red because it's a "danger" color, and I've countered with several examples of prominent red logos in aviation. I'll trust Stéphane's judgment here as to whether the color should be changed.

I really like the concept of the abstract aviation map, but I agree with the recurring sentiment that it tends to look a bit too much like a constellation, and not enough like an aviation map. I mentioned some of my thoughts in a comment, but to expand, I think there are two things working against the current design:

  1. It looks too random. Airways (which are the most obvious mental connection for the lines) always go to or from a navaid (yes, I'm aware of RNAV routes.. but their intersection symbol looks even more like stars, so probably not a good choice for reducing the constellation feel). For example, this area of the design:
    enter image description here
    shows a cluster of intersections and airways between them in a manner that you would never see on a real map. Sometimes, an airway will bend at an intersection, but both directions will go off towards a navaid, and you won't see more than one bend in between navaids. Here's an example of the hub and spokes pattern you'd see on a real map:
    enter image description here
    If it were up to me, I would use more navaids (perhaps including VOR/DME, not just VORTACs), more airports, and fewer intersections (triangles) because the triangles are the least aviation-specific of the symbols. That being said, there may be good design reasons for not going in that direction.
  2. It's self contained. On a real map, airways constantly go off in all directions. You can see in the image above that there are lots of lines which go off the edge of the map. The fact that, in the design, there's one big outline, and no lines which leave it, makes it feel isolated rather than expansive as a segment of a map would feel.

I think if those things were addressed, the design would immediately evoke "abstract aviation map" for more people.

There is a question of whether or not airways should connect to airports. Even though they don't in the real world, I initially advocated that they should connect because many airports are coincident with navaids, so pretending like they connect to airways isn't actually a big stretch. It looks better than overlaying a navaid with an airport, and the map was already pretty busy, so adding free-floating airports was risking making it too cluttered. Maybe that won't be true with a hub and spoke design, I don't know. I do tend to think that the airport symbol is the most important of the symbols to include, but I'm willing to defer to the designer's judgment on how to best include them. It is intended to be abstract, after all.

And again, I really want to thank Stéphane for his work and for putting up with me. We're being picky, but either way, I'm really excited to see the design go live on the site.


On a personal (non-design related) note, I wanted to say how proud I am of this community. I feel, in my time at Stack Exchange, I've "grown up" along side the site. I found out about the Area 51 proposal on my third day of work:

enter image description here

I followed the proposal and got to see the process of a site being born on our network. Over the years, I've gotten to see passionate people take ownership, and it's helped drive home that, while Stack Exchange may provide the platform, the site is really the people.

You all, your actions, your concerns, your questions have prompted me to have many discussions with our community managers that I wouldn't have otherwise ever had a reason to have. I've learned a ton from them, and I've tried to share their wisdom as best I could. It's been a huge privilege for me that I wish more people at the company would get to experience.

And now, I'm no longer a new employee at the company, and Aviation is a graduated site with a design ready to go live. It's like we're all grown up. Thank you to everyone who built this site and made it your own.

$\endgroup$
2
  • 7
    $\begingroup$ Contradictory opinions are why designers drink. (Also sysadmins, programmers, magazine layout artists, TV schedule programmers...) $\endgroup$
    – voretaq7
    Commented Jun 21, 2016 at 2:00
  • 5
    $\begingroup$ Really really big fan of the VOR/DME/VORTAQ combo. It just looks...right. There's really no other way to put it. It just looks like what my eyes were expecting to see. $\endgroup$
    – Jae Carr
    Commented Jun 22, 2016 at 6:21
15
votes
$\begingroup$

EDIT 2:

Another design concept.

enter image description here

  1. The "Questions", "Tags" buttons are re-made for a more simplistic style and less sim-like. The selected tab is in green, as is the selected state of many cockpit buttons.
  2. IFR chart laid very faintly on the white background. It is neater than my previous example, and it is more generic as well (my previous one emphasizes too much on airline cockpits).
  3. The tags use a box-like rectangle with no round radius at all. Many things in aviation a rather "square looking" and "mechanical" - rounded edges might not be the best representation of them.
  4. The font of the numbers use a more "cockpit reading" style font.

I object using red as the logo's color.

Don't get me wrong - I love the logo's design. It's a splendid piece of work and a smart design. However, in aviation, especially in cockpit design, red is a color which implies danger and require immediate attention. As the first time I climbed into a Cessna 172, my instructor told me:

Don't touch anything that's in red. Everything that's red is red for a reason.

The "Ask Question" button also suffers this problem. It makes me think pressing it will make the plane explode, and it's the type of button I have to put my finger on and ask my copilot to confirm before pushing it.

To extend a bit about color usage in the cockpit:

  • Red means danger and require immediate attention, for example engine failure, cargo fire. By immediate action, it means now, right now. Red is also used for switches that have severe consequence if activated wrongly, for example master switches, mixture lever.
  • Amber means caution. It's something you should take note of, for example fuel imbalance.
  • Normal text are in white / black, or sometimes green on some type of displays.

I'm fine with other colors (it's the designer's choice), I just don't agree with the use of red or amber as primary tone.


EDIT:

Here's what I meant:

enter image description here

Not sure if it tastes too tech savvy, but since I've done it, I'm uploading it here for everyone to discuss.

  1. The brown color emulates the panels in a Boeing 777 cockpit.
  2. The buttons emulate those on the Airbus (I don't want the design to look too Boeing)
  3. The vote up / down buttons are taken from the Airbus gear extension light.
  4. The font is "Franklin Gothic Book", which more resembles the font used on cockpit displays and buttons (except the "AVIATION" text under the logo, which is "Gill Sans MT").
  5. IFR chart can be seen faintly in the background.
  6. Little airplane icons for the badges on the top bar.
$\endgroup$
8
  • $\begingroup$ Also, the color tone seems very similar to Workplace.SE. $\endgroup$
    – kevin
    Commented Jun 20, 2016 at 14:18
  • $\begingroup$ I would also say the red in that shape looks like a railway symbol oddly. I agree with this, great logo, colour needs changing. $\endgroup$
    – D. Clayton
    Commented Jun 20, 2016 at 15:07
  • 5
    $\begingroup$ So you object to Mooney's logo too then? And Cessna and Piper logos since they have red in them? What about all the thousands of people who paint their aircraft red, or the dozens of airlines that use red logos? This logo isn't even the "remove before flight" or "this is broken" shade of red. I think it's a stretch to associate it as such. $\endgroup$ Commented Jun 20, 2016 at 15:52
  • $\begingroup$ I voted this up because I agree with the comments that the logo doesn't work super well in red. I don't mind the rest of the design though, tbh. $\endgroup$
    – Jae Carr
    Commented Jun 20, 2016 at 16:46
  • 1
    $\begingroup$ @BretCopeland well I don't mean to object everybody using red out there......but somehow the red in the design strut me as "red as in alert". Just saying that's my first impression. $\endgroup$
    – kevin
    Commented Jun 20, 2016 at 16:47
  • $\begingroup$ @BretCopeland To be fair, those other logos use a different shade of red. This color that has been selected for the logo here is more "emergency equipment" red than the deeper maroon you see on Mooney's logo. Honestly though, it's just a matter of taste I think. A deeper red, or perhaps a different color, just might look better is all. $\endgroup$
    – Jae Carr
    Commented Jun 20, 2016 at 16:48
  • 1
    $\begingroup$ I actually prefer the original red to the suggested blue, but I'm voting up this suggestion because I love the concept of the navigation buttons after the edit. $\endgroup$
    – Dan Hulme
    Commented Jun 21, 2016 at 14:53
  • $\begingroup$ How do you manage to change how the site looks for your images? I am kind of lost on how you did that. $\endgroup$ Commented Jul 2, 2016 at 16:55
10
votes
$\begingroup$

Further on falstro's comment about the chart, I've come up with a more realistic version. I mostly keep the nodes in their original positions, I replaced them with something more assembling an approach chart:

enter image description here

The color scheme here certainly needs tuning (maybe fade the chart like 50% transparency into the background).


EDIT: I've combined this with my other answer.

$\endgroup$
3
  • $\begingroup$ Using Jeppesen chart symbols looks and feels odd to me: I never use Jepp charts so they just look 'wrong' somehow. On the other hand, using the FAA's symbols would look too American, IMO. It could also be a trademark/copyright issue, but I have no idea about that. I'd say that abstract is probably better than realistic in this case. $\endgroup$
    – Pondlife
    Commented Jun 20, 2016 at 16:14
  • 2
    $\begingroup$ I think something like an enroute chart would be better than an approach chart: wikipedia picture for example. This looks too much like a functional part rather than a background. $\endgroup$
    – Sanchises
    Commented Jun 20, 2016 at 16:26
  • 1
    $\begingroup$ This is almost exactly what I saw in my head as a cool background design. For what the opinion of one low-rep low-participation user is worth. $\endgroup$ Commented Jun 24, 2016 at 15:43
6
votes
$\begingroup$

Awesome, looks real good. I like the logo idea of combining the AI with wings. The badge-icons is an obvious slam dunk. :)

One thing I noticed regarding the background, and I might be alone in this, so I'm just leaving it here to see if others see it the same way. When I look at the background, I see star constellations rather than an enroute chart. Also note that the symbols used are only on IFR charts (except the VORTAC, but they look slightly different on VFR charts), which not all people may be familiar with.

Nit picks; the filled in "reticle" elements are not present on aviation charts. The hollow ones (airports on IFR enroute charts) have shorter cross-hair lines and are never part of routes (coincident VORs or other navaids may be though) and thus wouldn't be connected with lines. The circle/dot is also new to me. However, with this being abstract I'm not sure how much that matters :)

$\endgroup$
8
  • $\begingroup$ Filled in airport symbols do sort of exist of VFR charts, granted they have runways in them. Placing airports as part of the "airway" network was actually something I pushed for, so don't blame Stéphane. He originally placed them free-floating, but it looked kind of busy and I said it wouldn't be a big deal if they were mixed in with the lines. As you pointed out, it's supposed to be abstract, not a real enroute chart. There aren't dotted line airways either. $\endgroup$ Commented Jun 20, 2016 at 15:58
  • $\begingroup$ @BretCopeland there are, just not in the US $\endgroup$
    – falstro
    Commented Jun 20, 2016 at 15:59
  • $\begingroup$ Crosshairs indicate the airport has fuel on US VFR charts: skyvector.com/… $\endgroup$ Commented Jun 20, 2016 at 16:02
  • $\begingroup$ @BretCopeland Yes my bad, already deleted the comment. Either way, I still think it looks more like a constellation chart than anything aviation, and IFR-only stuff is limited to a rather select group of people. But that's just me. $\endgroup$
    – falstro
    Commented Jun 20, 2016 at 16:03
  • $\begingroup$ And by the way, I do resent the notion that anyone's being blamed. Please don't suggest that I "blame" anyone. :) $\endgroup$
    – falstro
    Commented Jun 20, 2016 at 16:04
  • 3
    $\begingroup$ I agree it looks too much like a constellation. Probably because there are lots of randomly placed intersections rather than what looks like an airway system (with airway spokes coming out of the navaid symbols, and not random-bends coming out of intersections). As for IFR vs VFR symbols, the only thing that's IFR specific are the triangles. It didn't look to me like there was an internationally agreed upon VFR intersection symbol, so the triangles seemed like a good idea. And I didn't mean you were blaming him, I was just trying to say that the blame should rest with me for that call. $\endgroup$ Commented Jun 20, 2016 at 16:18
  • $\begingroup$ I think if there were fewer intersections and lines, then it would probably make sense to put the airport symbols back outside of the "airways". It was just a whole lot of symbols when you had everything above, plus more free-floating airports. $\endgroup$ Commented Jun 20, 2016 at 16:21
  • $\begingroup$ @BretCopeland the IFR/VFR symbols, yes, I agree, if going for the constellation chart it is probably the best in that respect (the VORTAC is IFR by the way, the VFR one is smaller and has a dot in the middle). There are more things to the world of aviation than chart symbols though ;) $\endgroup$
    – falstro
    Commented Jun 20, 2016 at 16:39
4
votes
$\begingroup$

Thanks for the fantastic work here, especially the logo. The attitude indicator part also looks like a runway stretching out to the horizon ahead of the aircraft, which is really great!

But I do agree with other comments about the background. At first glance I thought "constellation", not "chart". In fact, if you removed the two IFR VOR symbols there would be nothing at all in the remaining symbols that's distinctively and obviously aviation-related. I think something abstract is better than something real here, but this seems a little too abstract to me. Perhaps overlaying the symbols on some (simplified) terrain would help to make it clearer; as it is, the lack of any background elements behind the symbols themselves makes it seem like they're just floating there, and that points again to a constellation.

$\endgroup$
3
votes
$\begingroup$

Ooh, I have a slack day and get to come back and we have design stuff! Awesome!
Now I get to drive Stéphane crazy with ideas :)


The Logo

I like the general logo concept, particularly carrying the horizontal bar through the wings: It has a pleasing minimalist aesthetic to it, and as mins pointed out it follows along the same lines as other aviation-related logos: It pretty clearly says "This has something to do with aviation/flying."
Red wouldn't be my first choice of color as kevin mentioned, but I think the black mockup works well over a light background.

The logo shape seems a little "squished" horizontally to me, but that's probably because I'm used to seeing wings that are each a little wider than the logo center -- See for example the FAA WINGS pins:
WINGS pins
Might be worth playing around with the length of the wings in the logo a bit (try ~1.25x the diameter of the center circle) to see how it changes the sense of proportion.
(To my eye the proposed logo looks better over the site name than it does standing on its own - I think because the AVIATION text is wider than the logo and draws your eye outward.)


The Background

The abstract chart idea seems like the right way to go.
Like others I get the "constellation" impression rather than "Oh it's a chart!" - making it more hub-and-spoke like Bret suggested would probably take care of this.

I would also consider stealing some of the symbols kevin included like the holding pattern and approach leading to an airport/runway, possibly even an NDB symbol or two just to dress it up a bit and make it more "chart-like."
I'm OK with mashing together Jeppesen and FAA/NACO style symbols and blurring the line between an enroute chart and an approach plate here as part of artistic license - it's an abstract chart and it might look a little odd if we stare at it, but if it's just hanging out in the background I think most folks will just subliminally register that it's a chart of some kind.

I have no strong opinion on the color scheme for the chart - black on light blue certainly stands out more, but the subdued colors may be more appropriate for a background image (as a well-behaved background element that doesn't pull the users' eyes from the content).

$\endgroup$
2
votes
$\begingroup$

Since there's talk about color, don't forget magenta, it's used heavily in aviation. Magenta is used in cockpit instrumentation to highlight the route (desired path) for example.

If magenta doesn't work out, the way it is right now is very nice. It contrasts nicely with the background.

$\endgroup$
1
  • 1
    $\begingroup$ You're clearly only suggesting magenta because of your randomly-generated purpleish gravatar :) $\endgroup$
    – voretaq7
    Commented Jun 21, 2016 at 2:04
1
vote
$\begingroup$

Stéphane, thanks for the work.

(dammit, I discover that there is a script to remove anything starting with "hi Stéphane"!)

I like the logo, and also believe it's unique, except in red, it reminds a bit the ABB logo:

enter image description here
Source

FYI, the closest I found are remote:

enter image description here
Source

enter image description here
Source

enter image description here
Source

enter image description here
Source

Also the Mini logo.

I don't like the background because too similar to constellations in the sky. The idea is good, but the rendering may be refined.

$\endgroup$
1
vote
$\begingroup$

My only contribution to this whole debate is I really want us to have custom up and down vote arrows. I mean, planes are so arrow like to begin with, it seems obvious (maybe too obvious)?

We had a discussion on it a while back, long before we even started this design process? Perhaps this could be considered as well?

Custom vote up/down arrows

$\endgroup$
1
  • $\begingroup$ As I already said, we're not customizing vote arrows shape anymore, it's not scalable. We're just customizing the colors. $\endgroup$
    – Stéphane
    Commented Jun 22, 2016 at 9:57

Not the answer you're looking for? Browse other questions tagged .