Branding for Python hub

[lauracumming]

Summary We would like to create a look and feel for the new Python Hub. We want something that attracts kids from around aged 11 years old. So think teens.

User story _As a teenager that is learning Python for the first time _I would like to feel confident and excited when looking at the learning resources _so that I am engaged and keen to learn

What pages will be changed? We will be adding images to the Play and Teach pages on the website, the student dashboard, the resources themselves, and use assets in social media too. We will probably also print some stickers.

Outcome/deliverable Initially, please propose

• [x] three quick concepts, from these we will need:

Followed by:

• [x] Characters/figures that can be used to 'speak' throughout the resources
• [x] Graphic elements to pick out sections in resources
• [x] Cover graphics for slide and hero image
• [x] Colour palette
• [x] Leading font (for logo and any graphical wording) Body font will remain as Inter

Tools Illustrator / Figma

Concerns Ensure all is copyright free

Deadline As marked by sprints

Links [https://code-for-life.gitbook.io/python-lessons-with-raspberry-pi-ide/3GnBiHhkcxRgUkKhYFz4]

Reviewer @lauracumming

People to contact @lauracumming

Acceptance Criteria

SVGs are saved to folders, artwork is saved to folders, any links and fonts are packaged.

[ligiaolmos]

Hi @lauracumming , thanks for the brief, I will start asap and reach out if I have any questions. I assume we don't have a logo yet and the copy in the logo should be "Python Hub" Could you confirm that? Thanks!

[lauracumming]

We don't have a logo or a name. There may be something Python based that is sexier than Python hub. See if you can find anything, otherwsie we can go with 'The Python Hub' or something.

[ligiaolmos]

Hi @lauracumming I'm attaching the exploration and drafts I'm working on for the Python Hub. As you can see in the files attached there are some suggestions for logo, naming, colours combo and a draft for the portal (I know that is probably not doable to recreate my design suggestion but I had fun exploring how we could apply the branding in a landing page :) For some inspiration for future development). Also, I made some graphics to use in the portal and material and found a 3D icon pack (free to use and edited the colours to match the branding colours selected).

I made a design for the banner header (for now the photos I created using ai models but we can change them if you like). Also in the portal landing exploration you can see a monster I drafted but I have some more sketches that I'm working on.

Let me know what do you think. Perhaps we could schedule a call to review those drafts and discuss your feedback.

Thanks! Ligia

[ligiaolmos]

Here with Intern as body font and the proposal for branding font

[lauracumming]

@ligiaolmos fantastic start to this project! I think Python Lab and Python Den work best. I think the 2D graphics work well with our overarching brand, but maybe we can bring some 3D into the logo type, like we do with Rapid Router. If we are to use this font, it will need to work with Inter too.

I'll put a call in to talk through it all. 👍

[lauracumming]

We are also aiming at 11-16 years with this, so we may need a slightly older demographic for photography too.

[ligiaolmos]

Ok, I can add this 3D feeling to the logo and recreate the photographs, no problem. Let's review and discuss further 👍

[ligiaolmos]

Hi @lauracumming I hope you are well. Here is a concept for the logo which is more typographic and with a 3D feel to it. I'm working on applying it with the header and characters (with some changes in the colors of clothing to match in style). I made a version with a rounded eye and another with a more "fearless" expression on the eyes. What do you think?

[lauracumming]

Quite like the idea of 'fearless' coming into it all. 👍 We may be able to use that as a hook to get the girls and boys fired up about the learning.

Also, the fearless eye is suited to an older audience, so let's go with it. Using the navy as the dominant colour for background also works i think. Gives it a more mature feel. and the pink 'pops'

I wonder if any scales can be hinted at too, in the text?

[ligiaolmos]

Hi @lauracumming this week I had to work on 6 different prototypes and couldn’t advance much here but next week I will send the logo/branding finalised. Just wanted to clarify what do you mean by "scales can be hinted at too, in the text"? thanks!

[lauracumming]

@ligiaolmos snakeskin 🙂

[lauracumming]

texture

[lauracumming]

Thinking a bit of texture would be great?

[ligiaolmos]

Hi Laura, I've been trying with adding a snake texture, we need to make sure not to compromise legibility and even in a small scale still have good readability so I tested the following options

[ligiaolmos]

[ligiaolmos]

[ligiaolmos]

[ligiaolmos]

I suggest we go with one of the last 2 as the first one (even if the texture is more realistic) makes the colour less fresh and adds too much detail and we will need to define a minimum size quite big to not loose details.. What do you think?

[ligiaolmos]

[ligiaolmos]

Here an idea of how we could add the snake texture in other elements like the banner header. Also I recoloured the Kurano characters so we can use as the guide characters for tutorial and materials instead of the monsters. Let me know what do you think. Thanks

[lauracumming]

These look great @ligiaolmos. I think that first logo works well with the subtle gradient pattern, and then how you bring it into the background ties it all together. Let's lose the pencil, i don't think you need those study elements anymore. The patterns and colours work well.

We can use the characters and maybe dig out some of the artefacts to add interest around concepts etc late along the line.

I think we are there with the look and feel so we can wrap this up with a style guide and save elements into folders.

Then we can look at separate tasks for slides, lessons and webpage etc.

Nice one!

[ligiaolmos]

Great! Glad to hear :) I will work on those tweaks and prep the elements to save on the folder in Gdrive. thanks