A New Design for the "Congratulations!" Page

[Tim Allen]

I've had the privilege of introducing Django to many people over the past several years. A recurring theme I have noticed is that once a new Django developer reaches the "It Worked!" page, the inevitable next question is, "now what?"

It struck me that this page is valuable real estate for the newcomer. Since my eye for design is practically non-existent, I worked with a talented colleague and we came up with an idea to replace the "It Worked!" page. Here is a link:

https://chadwhitman.github.io/congrats/django/

Some of the goals we wanted to achieve:

• Provide a friendly design using the same themes as the Django Project website.
  
• Ensure the developer is using the current version of Django. Many tutorials found through Google are for older versions of Django.
  
• Provide links to the current versions of the documentation, introductory polling tutorial, and community.
  
• Include the release notes for the current version of Django.
  
• Focus on the new Django developer, as many seasoned Django developers will using other methods for starting projects.
  

While it is doubtful that many would see this screen on a small device, it is fully responsive as well. It is self-contained, with minified CSS and SVG icons, and a total size of 20k, so it shouldn't provide much bloat at all.

We're looking for feedback, and if the community thinks it is an improvement, we'll be happy to work on a pull request. A big hat tip to my colleague Chad Whitman for his design talents.

Regards,

Tim

[Tom Forbes]

I'm not a core developer but I'd just like to say that your redesign looks amazing and is a big improvement. Even if this specific design is not acceptable I think it's a great idea to link to the tutorials/documentation from that page.

I'm not a big fan of it loading the fonts from Google Fonts however, is it possible to bundle them or use a system font?.

--
You received this message because you are subscribed to the Google Groups "Django developers (Contributions to Django itself)" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-developers+unsubscribe@googlegroups.com.
To post to this group, send email to django-developers@googlegroups.com.
Visit this group at https://groups.google.com/group/django-developers.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/CACrTqc1%3Du9oG9At%3DY-SxavYtvwTb6qN5dSAUDJL0AkxJrKvQQQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[Tim Allen]

Switching to another font is certainly an option. Is the issue with Google Fonts the Apache license versus the Django BSD license?

[Collin Anderson]

Beautiful.

The Google Font should not be an issue. We're already distributing that as part of the admin, which is installed by default. The page could just reference /static/admin/css/fonts.css.

Does a license need to be included for the rocket animation, or is that your own work?

I hope the links could be auto-generated so they don't need to be hand-updated with every version.

I think the unused css should be removed. We're not using button,input,optgroup,select,textarea, etc.

On Tue, Apr 18, 2017 at 12:03 PM, Tim Allen <fli...@peregrinesalon.com> wrote:

Switching to another font is certainly an option. Is the issue with Google Fonts the Apache license versus the Django BSD license?

--

You received this message because you are subscribed to the Google Groups "Django developers (Contributions to Django itself)" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-developers+unsubscribe@googlegroups.com.
To post to this group, send email to django-developers@googlegroups.com.
Visit this group at https://groups.google.com/group/django-developers.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/c635d1e2-45e5-4b31-8ae2-f6acb00f943f%40googlegroups.com.

[Daniele Procida]

On Tue, Apr 18, 2017, Tim Allen <t...@peregrinesalon.com> wrote:

>It struck me that this page is valuable real estate

Yes it is! Firstly, I think that both your idea and design are excellent and I approve.

Secondly, since that space is valuable, perhaps it could also say:

This release of Django has been sponsored by <company>. <logo>

Django is free open-source software. Support Django's development <link>

The more I think about this, the less I think it's a bad idea...

Daniele

[Aymeric Augustin]

Hello Tim,

Thanks, that's a great initiative!

Given the well-documented success rate of design by committee, including our experience redesigning djangoproject.com, there's a risk that an inconclusive discussion on this mailing list will prevent your proposal from moving forwards.

Perhaps a good way to avoid that would be to form a small team (two or three people, including yourself and at least one committer) to evaluate the feedback and reach consensus in a smaller group. (I'm happy to help with the technical aspects e.g. how to load fonts.)

For what it's worth, I noticed a couple layout glitches in the current proposal, but nothing major:

- <main> can overlap <header> and <footer> at small heights e.g. with developer tools open at the bottom

- links look bad at 320px wide — try the "iPhone 5" setting in Chrome's responsive view

Best regards,

-- 

Aymeric.

--
You received this message because you are subscribed to the Google Groups "Django developers (Contributions to Django itself)" group.

To unsubscribe from this group and stop receiving emails from it, send an email to django-develop...@googlegroups.com.
To post to this group, send email to django-d...@googlegroups.com.

Visit this group at https://groups.google.com/group/django-developers.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/CACrTqc1%3Du9oG9At%3DY-SxavYtvwTb6qN5dSAUDJL0AkxJrKvQQQ%40mail.gmail.com.

[Tim Allen]

Thanks for the kind words. To answer your questions:

- My colleague Chad did the rocket animation. We'll both do git signed commits on any pull request and add ourselves to authors.

- It is also my hope to automagically create version friendly links, so we don't see a commit on each Django release.

- Good catch on the CSS. We're tracking these issues.

On Tuesday, April 18, 2017 at 12:15:10 PM UTC-4, Collin Anderson wrote:

Does a license need to be included for the rocket animation, or is that your own work?

I hope the links could be auto-generated so they don't need to be hand-updated with every version.

I think the unused css should be removed. We're not using button,input,optgroup,select,textarea, etc.

On Tue, Apr 18, 2017 at 12:03 PM, Tim Allen <fli...@peregrinesalon.com> wrote:

Switching to another font is certainly an option. Is the issue with Google Fonts the Apache license versus the Django BSD license?

--
You received this message because you are subscribed to the Google Groups "Django developers (Contributions to Django itself)" group.

To unsubscribe from this group and stop receiving emails from it, send an email to django-develop...@googlegroups.com.
To post to this group, send email to django-d...@googlegroups.com.

Visit this group at https://groups.google.com/group/django-developers.

[Tim Allen]

Your point on design by committee is spot-on; I think that's the direction we'll head in. Thanks for the kind words, and I've noted the issues on the smaller height and smaller screen issues. It is much apprecaited!

Regards,

Tim

[Ryan Hiebert]

Finding funding for open source is notoriously difficult, and if this can turn out to be a net benefit for the project, I think this is a really neat way to do it. Good thinking, Daniele.

One comment on the design, though, that might be worth considering. The admin redesign that happen a few releases back originally chose to use similar styling to djangoproject.com, but it was decided that it would be better to keep it a blue theme instead, so that they were visually distinctive. I think that reasoning also applies here, to keep this initial page distinctive from the pages that are actually hosted on djangoproject.com.

Overall, I love the idea, thanks for putting the work in.

[Collin Anderson]

I was also reminded of green color the green color discussion.

From the discussion about the admin redesign [0][1]:

"makes keeping a visual identity for Django hard to separate from the admin UI"

"the admin is part of _your_ site, not ours, and so should have a visually-distinct theme/brand that can enforce the user's theme, not ours."

I think the green might be less of an issue for this page, as end users shouldn't see it, and really it might make sense to keep the Django brand here, as that's what the page is all about.

[0] https://github.com/django/django/pull/4232

[1] https://groups.google.com/d/topic/django-developers/HJAikaEBqJ4/discussion

--

You received this message because you are subscribed to the Google Groups "Django developers (Contributions to Django itself)" group.

To unsubscribe from this group and stop receiving emails from it, send an email to django-developers+unsubscribe@googlegroups.com.
To post to this group, send email to django-developers@googlegroups.com.

Visit this group at https://groups.google.com/group/django-developers.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/CABpHFHSRnbUpQz3Q7E1ivZC%2BfK82gW2%3DcpKQerapSrXddPkveA%40mail.gmail.com.

[Chris Foresman]

On Tuesday, April 18, 2017 at 1:25:36 PM UTC-5, Tim Allen wrote:

Thanks for the kind words. To answer your questions:

- It is also my hope to automagically create version friendly links, so we don't see a commit on each Django release.

This ought to be useful to sub in where necessary for doc links:

>>> import django

>>> doc_version = '.'.join(django.get_version().split('.')[:2])

>>> doc_version

'1.8'

 

[Federico Capoano]

Looks like a great improvement for newcomers! I hope to see this included to Django.

Federico

[Adam Johnson]

A massive +1 from me too, but I'll not make any comments on design :)

On 19 April 2017 at 09:58, Federico Capoano <federico...@gmail.com> wrote:

Looks like a great improvement for newcomers! I hope to see this included to Django.

Federico

--
You received this message because you are subscribed to the Google Groups "Django developers  (Contributions to Django itself)" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-developers+unsubscribe@googlegroups.com.
To post to this group, send email to django-developers@googlegroups.com.
Visit this group at https://groups.google.com/group/django-developers.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/cdff13ec-bf9e-406e-addf-ec2c78b2a8bd%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

Adam

[Babatunde Akinyanmi]

I also give a big +1 to this. I'll really love to see this in django 

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/CAMyDDM0vXAj0p3YZZbmOhCwa4G4%3Dm9xA1pgtLFuhxC7do%3DmEHQ%40mail.gmail.com.

[Óscar M. Lage]

+1 here too, congrats!

[Info-Screen]

The links to the tutorial/docs is a good idea.

I would design the message like the other messages (404, 500, and current It Works!) to keep it look the same, but I would also accept the good looking version you proposed

[Aymeric Augustin]

On 18 Apr 2017, at 20:31, Tim Allen <fli...@peregrinesalon.com> wrote:

Your point on design by committee is spot-on; I think that's the direction we'll head in.

Hello,

For the sake of transparency, a group of five people (Tim, Chad, Collin Anderson, Frank Wiles, and myself) is now working on polishing the proposal. We'll ask for feedback on the next iteration when it's ready.

Best regards,

-- 

Aymeric.

[Federico Capoano]

That's a great news, let us know if we can help with more feedback.

Federico

--
You received this message because you are subscribed to a topic in the Google Groups "Django developers (Contributions to Django itself)" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/django-developers/G09hwOQIdvU/unsubscribe.
To unsubscribe from this group and all its topics, send an email to django-develop...@googlegroups.com.

To post to this group, send email to django-d...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-developers.

To view this discussion on the web visit https://groups.google.com/d/msgid/django-developers/3FB44932-5729-479D-BF74-771BAE4A3E27%40polytechnique.org.

[Darius]

Hi Tim,

Here are my thoughts:

1. The main message "it worked" has given his placement to a log, leaving the user to focus on the image when the page loads. This can leave the user wondering if it worked until they see the lwords "The Install Worked". Congratulations. reload the page, what is the first thing your eyes will focus on? 
2. The simple (it worked) message is now a longer "The Install Worked", congratulations. Keep in mind the word "Worked" is the main message
3. The current design delivers the message clearly. It worked. Nothing more, nothing less.
   

The new design offers additional info and links in the bottom of the page which is really nice and helpful for the new users. So well done there.

I would keep the current simple message "it worked" and also, more importantly, its placement. As a new user, nothing is more rewarding to immediately see it worked message as soon as the page loads.

And thank you for all your efforts.

Darius