PHP 8.5 Release Page Design Contest Submission #1545
Description
Names and Contact Details
Daniel Shields – daniel@elven.dev – www.elven.dev
Link to mockup/prototype
https://php85-redesign.vercel.app
Rationale (300-600 words)
My goal was to create a design that could integrate well with the existing website, using as much of the same brand colours and design elements as possible, and trying to create a design that looked modern but that also belonged on the PHP.net website. This would allow a transition for further design changes on the rest of the website and future versions of PHP.
This design would use the same navbar that the current website does to help with the transition.
I wanted to feature the new Pipe Operator in the hero of the website as I feel like it's such an exciting new feature for the PHP community. This header may not work in future designs but as I see this as a transition, it could be replaced with an image later or some download instructions with different tabs for each operating system.
Another change that I included is a flexible grid for the code previews, as different examples have different line lengths and I tried to find a balance wherever possible so no code was truncate or wrapped.
In the design brief you mentioned no Javascript, but if you change your mind in the future we could switch to using tabs on some of the larger code previews like "Closures and First Class Callables in Constant Expressions." That would allow users could switch between the different code samples to save space when viewing a large amount of code.
The elephant illustration used in the "At a Glance" section is from the noun project with a royalty free commercial license, I purchased a license myself for this project. However, if you use the design you may want to purchase an additional license on behalf of the php.net organisation too... or choose another elephant.
The footer of the website includes a callout to the PHP Foundation and a donate button, I pulled this from the homepage, but it would be easy to update the text to match The PHP Group? I'm not too sure how the organisation are related...
Another change you'll see is a notification badge in the top-left corner as it seems much cleaner to me (instead of using "Released!" in the H1 title) ... as time goes on you can update it for other urgent news you include a date.
The design should able be to adapt easily enough to dark mode, but as the current website doesn't support that, I decided to use a mix of dark grey and light grey backgrounds like the current design... but I left that as a future problem for the full website redesign.
The website was designed with tailwind but updated to use BEM styling to its easier to integrate into the current website.
Thanks for taking time to look at my design!
You can view the code for the website here: https://github.com/tao/php85-redesign
License
- I confirm, and agree.