Bri-Toon Posted February 26, 2018 Share Posted February 26, 2018 I started this months ago, and I'm not too sure about the final result, but it won't hurt sharing it, right? This an idea I am sharing for if there is ever to be an application by Affinity for website creation. I tried my best figuring out the best way to have this mockup logo flow with the others, and it was quite a challenge. The official Affinity Designer logo is there to show a side-by-side comparison. For the Web logo, I made a border layer and interior layer separately, because I noticed each Affinity application has the same border but a different inside. I know it's not perfect, and I'm sure there are still several mistakes, but this is what I came up with. And the Web logo below is to show what it would look like with outlines. I'm not sure which one I like better, but I couldn't get the original to flow along with the others. CalvinCoolridge and Renzatic 2 Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Ros Posted February 26, 2018 Share Posted February 26, 2018 Hi @Bri-Toon, this is an interesting exercise to do, and I like the results. I would choose the first one. Maybe you could try to integrate it a little bit more with the original by replicating the subtle shadows that the inner shapes have and adding another color in a subtle manner, as the green-ish "light" in the center of the AD icon. Have a great day. Bri-Toon 1 Quote http://jjros.dribbble.com https://www.instagram.com/rosvectors/ Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 27, 2018 Author Share Posted February 27, 2018 Thank you for your suggestions, Ros. I changed the editing just a bit so I could add the outer shadow to the inner objects and so it would show. It really made a difference! I also made some other slight adjustments. And thanks. You have a great day too. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Alfred Posted February 27, 2018 Share Posted February 27, 2018 You might want to change the colour scheme, Brian. Serif have kept the blue colour of the DrawPlus logo for Affinity Designer, the purple colour of the PhotoPlus logo for Affinity Photo and the orange colour of the PagePlus logo for Affinity Publisher, so if they ever do release Affinity Web it’s very likely that they would retain the green theme established for WebPlus. Ros 1 Quote Alfred Affinity Designer/Photo/Publisher 2 for Windows • Windows 10 Home/Pro Affinity Designer/Photo/Publisher 2 for iPad • iPadOS 17.4.1 (iPad 7th gen) Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 28, 2018 Author Share Posted February 28, 2018 I never would've noticed that, Alfred. Someone has been paying careful attention. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Alfred Posted February 28, 2018 Share Posted February 28, 2018 It’s hard not to notice if, as I do, you own multiple versions of each application! If you search on the Internet for images relating to MoviePlus, you’ll quickly find out its colour, too. BTW, is there a particular reason why the right-angled triangle surrounding the arrow has its apex hidden behind the border of the logo? I also wondered why the arrow is asymmetrical. Pure curiosity on my part: I do like your logo design, despite its being the ‘wrong’ colour. Quote Alfred Affinity Designer/Photo/Publisher 2 for Windows • Windows 10 Home/Pro Affinity Designer/Photo/Publisher 2 for iPad • iPadOS 17.4.1 (iPad 7th gen) Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 28, 2018 Author Share Posted February 28, 2018 The arrow is asymmetrical because it is supposed to symbolize a mouse cursor (slanted). If I were to have the arrow face directly up to meet symmetry of the triangle, I feel it wouldn't draw the message as clear that it is meant to indicate mouse clicks. So with the arrow being asymmetrical, that would also mean to have other shapes work around it. Only certain sides can be parallel to the arrow while other sides need to be parallel to the outer border. As for your question, none of the shapes are actually hidden. I did originally say that the border and inside are two different layers, but then following Ros' suggestion of adding a drop shadow, I decided to change my style. I put the inner content on top of everything else. So some pieces that may look partially hidden in the modified version do not actually have outlines. Those are gap spaces. Looking at the official logos more carefully, I guess they actually don't have borders either, but they show a large range of what is set behind. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Alfred Posted February 28, 2018 Share Posted February 28, 2018 47 minutes ago, Bri-Toon said: The arrow is asymmetrical because it is supposed to symbolize a mouse cursor (slanted). If I were to have the arrow face directly up to meet symmetry of the triangle, I feel it wouldn't draw the message as clear that it is meant to indicate mouse clicks. So with the arrow being asymmetrical, that would also mean to have other shapes work around it. Only certain sides can be parallel to the arrow while other sides need to be parallel to the outer border. My bad. I've just looked closely at the arrow cursor on my screen and it looks exactly the same shape as yours! 49 minutes ago, Bri-Toon said: As for your question, none of the shapes are actually hidden. I did originally say that the border and inside are two different layers, but then following Ros' suggestion of adding a drop shadow, I decided to change my style. I put the inner content on top of everything else. I wasn't referring to the arrow and other shapes, I was referring to the dark red triangle surrounding them. I expected it to come to a sharp point where indicated by the circle in the screenshot below, but it gets cut off. Quote Alfred Affinity Designer/Photo/Publisher 2 for Windows • Windows 10 Home/Pro Affinity Designer/Photo/Publisher 2 for iPad • iPadOS 17.4.1 (iPad 7th gen) Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 28, 2018 Author Share Posted February 28, 2018 Ah good catch. That was unintentional. Trying to correct it now and keep all of the gap space the same width at this point will be tough, so I remade all of the front elements. Creating Gap Space.mp4 Also, here is the new green logo. The only other difference is that the cursor now has a flat bottom. I know the method in the video is not the best way, and I agree that the region you showed me should now come to a direct point. Honestly, I don't know the right way to do this and keep the width of the gap space the same. If I try manipulating shapes now, the width of the gap space will change, so I'm a little stumped. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Alfred Posted February 28, 2018 Share Posted February 28, 2018 37 minutes ago, Bri-Toon said: Trying to correct it now and keep all of the gap space the same width at this point will be tough Maybe I don't understand what you mean by "gap space", but I think you just need to reduce the width of the triangle so that the vertical edge moves slightly to the right (and then realign the arrow with that edge, of course). 40 minutes ago, Bri-Toon said: Also, here is the new green logo. Nice! 40 minutes ago, Bri-Toon said: The only other difference is that the cursor now has a flat bottom. I think it's too flat now. I preferred your original version, but you might like to experiment with making that bottom line perpendicular to the sides of the arrow stem. Quote Alfred Affinity Designer/Photo/Publisher 2 for Windows • Windows 10 Home/Pro Affinity Designer/Photo/Publisher 2 for iPad • iPadOS 17.4.1 (iPad 7th gen) Link to comment Share on other sites More sharing options...
MikeW Posted February 28, 2018 Share Posted February 28, 2018 RE the arrow. I am assuming the previous versions with what is being called the flat bottom is squared off to form two 90 deg. intersections? If so, optically it looks wrong. I.e., it appears slanted to the eye. An optical correction by bringing the upper intersection so as not to create a 90 deg. intersection would make it actually look more like a "flat bottom." I also think the mis-matched back arrow points look odd and creates an optical illusion of the arrow tail being at an angle to the head...which it might be, but... Quote Link to comment Share on other sites More sharing options...
MikeW Posted February 28, 2018 Share Posted February 28, 2018 BTW. While Serif has kept the general color scheme of PP, Php & DP, I doubt if they did create and release an Affinity Web, that it would retain the green color and so in that sense I like the red icon Brian made more. Quote Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 28, 2018 Author Share Posted February 28, 2018 (Editing Post) Some issue occurred. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Bri-Toon Posted February 28, 2018 Author Share Posted February 28, 2018 Quote Maybe I don't understand what you mean by "gap space" Here is a red highlight I made showing it. So I am saying if I change the shape of one of the curves, the width of the space will be uneven. Quote I think it's too flat now. I preferred your original version, but you might like to experiment with making that bottom line perpendicular to the sides of the arrow stem. Fair enough. I can change that. I tried to replicate the way the cursor looks, but then I realized from Google images that the bottom is not flat. It's hard to tell when it's so tiny and pixelated. This is what my cursor looks like. Quote I am assuming the previous versions with what is being called the flat bottom is squared off to form two 90 deg. intersections? So you think the newer version of it looks better? Quote An optical correction by bringing the upper intersection so as not to create a 90 deg. intersection would make it actually look more like a "flat bottom." I don't understand what you mean by this. Bring it how? I need a bit more details. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
lepr Posted February 28, 2018 Share Posted February 28, 2018 . Ros 1 Quote Link to comment Share on other sites More sharing options...
Ros Posted February 28, 2018 Share Posted February 28, 2018 That's a legit click-pic. Quote http://jjros.dribbble.com https://www.instagram.com/rosvectors/ Link to comment Share on other sites More sharing options...
Lon in MacArkansas Posted March 1, 2018 Share Posted March 1, 2018 Nice renditions, so far, BT. However, it seems to me that APh has kept the lens diaphram idea from PhotoPlus, and it feels like AD has kept the pen/pencil point from DrawPlus. As far as I can tell from the teaser video, it appears as though APub's logo has some stylized pages, similar to what PagePlus had in the past. I'm wondering how the cursor icon has fit into the Aweb "pretend" icon. Don't get me wrong. Any icon that you can dream up that gets Aweb to the starting gate is just fine with me, but I suspect the designers might reach back to the stylized globe/solar_system/web thingy on any actual Affinity Web package. It was only in the X8 version that they went to the laptop icon, and moved away from the web-like swoosh of rings. Lon "I'll take movie icons for $500, Alex" in MacArkansas Quote Link to comment Share on other sites More sharing options...
Alfred Posted March 1, 2018 Share Posted March 1, 2018 10 minutes ago, Lon in MacArkansas said: Lon "I'll take movie icons for $500, Alex" in MacArkansas Are you trying to put yourself in ... er ... Jeopardy, Lon? Quote Alfred Affinity Designer/Photo/Publisher 2 for Windows • Windows 10 Home/Pro Affinity Designer/Photo/Publisher 2 for iPad • iPadOS 17.4.1 (iPad 7th gen) Link to comment Share on other sites More sharing options...
Bri-Toon Posted March 1, 2018 Author Share Posted March 1, 2018 2 hours ago, Lon in MacArkansas said: Nice renditions, so far, BT. However, it seems to me that APh has kept the lens diaphram idea from PhotoPlus, and it feels like AD has kept the pen/pencil point from DrawPlus. As far as I can tell from the teaser video, it appears as though APub's logo has some stylized pages, similar to what PagePlus had in the past. I'm wondering how the cursor icon has fit into the Aweb "pretend" icon. I understand. I just thought I'd try something a little different and see how it turns out. Thank you for your feedback. It's interesting to see how Serif, after the original Affinity logos, changed them to have them be distinctive to the old Plus logos. Quote The website is still a work in progress. The "Comics" and "Shop" sections are not yet ready. Feel free to connect with me and let me know what you like or what can be improved. You can contact me here, on my contact page, YouTube channel, or Twitter account. Thanks and have a great day! Link to comment Share on other sites More sharing options...
Lon in MacArkansas Posted March 1, 2018 Share Posted March 1, 2018 2 hours ago, Alfred said: Are you trying to put yourself in ... er ... Jeopardy, Lon? Er....doubly so! If I didn't live in jeopardy, I'd be homeless! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.