Propose Mockups for Official Site

[hscstudio]

I only propose for new official site

http://www.hafidmukhlasin.com/2015/11/26/yii2-rebranding-yii-framework-official-site/

[jacmoe]

You do have a point about the duplicate Yii logo, though - or I think that you might have.

I would rather hide the logo in the nav-bar on the front page, then.

How does that sound?

((I will try and test it out ...))

[hscstudio]

I use lowercase on text "the solid foundation for your php application" only for art.. I know should PHP in uppercase... but art break all.. depend our imagine.. But if we disagree.. I think we can change PHP to web.. think globally.. that Yii is web application not only php application... "the solid foundation for your web application"

I am not a teaser approach fan.. but we can do for visitor focus.. and give simple impression for visitor.. You can see my picture not realy have spot corner.. I know about, spot corner can make old if it only small and have same diameter.. but my picture.. no.. soft color spray.. and focus in center..

About "hide the logo in the nav-bar".. sound good.. but we need try it.. I will always support this project..

You are not angry? I am sorry if I disturb You work..

I am only Indonesia Yii Lovers :).. and I want Yii get populer, trendy and modern

[jacmoe]

I am not angry - I know that it is quite common to have a minimal and teaser like header - what you have shown is a good idea, but very similar to a thousand sites - no disrespect, just my opinion, OK?

I wanted to go along a different route, where pretty much everything that can be said about Yii is visible without scrolling or clicking.

The bold colour is also a choice that I made..

And regarding the spotlight effect: actually, it does have a spotlight effect right now, because the white 'yii' next to the logo really draws your attention - it does create a spotlight effect, but I think it is more subtle and perhaps more effective?

I don't know :)

Thanks for the input - it is appreciated - I just need to express my intentions, so don't take it the wrong way.

I am Danish - we are known to be direct in a way that could be confused with rudeness. :p ((Vikings...))

I am open to any change - as soon as I have done what needs to be done - you are free to change anything.

[hscstudio]

or

oke.. You (y).. I propose my main part of our mockup.. and we can hide logo in navbar..

[muhammadcahya]

With all my respect, I like all the mockup/design above , this is my idea, what's your opinion all ?

My Half(50%) Mockup

[jacmoe]

@hscstudio

That's how it looks in mobile mode:

Let us think about what you suggested - we need more input.

@muhammadcahya Interesting. :) I like the top part - after that it kind of becomes bland.

It looks stylish - a pity about the logo, though.

I think I need to let this hang for a bit because I need to concentrate on my todo-list.

Don't let the comments/ideas stop.

[hscstudio]

@muhammadcahya : I think too soft.. need more character.. @jacmoe : in mobile we should hide text yiiframework.. leave Y logo only in navbar

Please dont use text "framework" with grey color.. its dead color with blue... Should white color for it same with text Yii

[muhammadcahya]

@jacmoe & @hscstudio : Yes, I think bland and too soft so Like I said before, this is not finished yet, maybe 50%, I'm not playing about the color now, but in design above I talk about 'layout' concept :)

[jacmoe]

@hscstudio :

Nope. 'Yii' is more important than 'framework' :)

Well, I might change it later - not now, though. I don't agree that grey and blue are dead together. (( If they should be the same colour, then I think that 'framework' could go altogether, leaving only 'yii'.))

Not sure about the hiding of the logo - it would look weird. At least that's what I think.

I have to follow my idea through - otherwise, if I should change direction completely all the time, I wouldn't be able to create a coherent design, which I think is important: that all the pieces fits together to form a whole.

What happens later, who knows ? :)

[hscstudio]

I hope that you immediately change mind @jacmoe :+1:

@muhammadcahya : I think layout more simple that color :) Its can change regularly.. but color NO.. :) good try

[jacmoe]

@hscstudio :+1: :dancer:

I might drop the 'yiiframework' for the jumbotron section, leaving only the petals, just for kicks.. no promises, though :)

Fortunately, the way I am coding the colours can be changed just by changing a few sass variables.

[jacmoe]

About being minimal or not:

Bootstrap can get away with a purple background with a 'B' simply because it is universally known.

Yii is popular, but there are still a lot of (unfortunate) people that don't know what 'Yii' stands for. So they need a bit of explanation/persuasion.

Bigger brands don't need to do that. They are brands.

[samdark]

@hscstudio good suggestions, you definitely know what you're doing. Keep these going. Thanks!

@jacmoe hiding logo in navbar at start page would make it inconsistent because at pages that aren't front page you have to show the logo in the bar.

I also think that grey and blue aren't looking goog enough together.

I love https://github.com/yiisoft-contrib/yiiframework.com/issues/72#issuecomment-160817814 second variant or https://github.com/yiisoft-contrib/yiiframework.com/issues/72#issuecomment-159868139 step by step features description w/ screenshots.

@muhammadcahya good try but overall I would not go this direction.

[jacmoe]

I separated the words and gave 'framework' just a tiny tint of grey: I also made the background slightly darker - still ends up being slightly lighter than base Yii blue at the end.

[samdark]

Looks much better.

[muhammadcahya]

I not want to show on my mockup again :p Yes, I accept gracefully as @samdark say, overall will not follow my direction :)

But here, with this mockup above, I only want to show. on the word 'yii framework', is bad with 'Y' big ? Why 'Yii' with a capital 'Y' looks weird ? Like the logo menu in my example above, i think with 'Y' is same better with 'y', but with 'YiiFramework' I think more readable than 'yii framework', what's your opinion @jacmoe ? :)

With a balance between the logo size, spacing and text, i think will be better :)

[jacmoe]

It just looks weird next to the logo, that's all - not on it's own :)

I like your mockup @muhammadcahya , but not for this project. Perhaps for other things?

[hscstudio]

Poin plus of @muhammadcahya last mockups are:

1. he create big navbar (height more than generaly) and white color.. yii logos very match with soft color background.. why? Because yii logo have 3 colors.. I think it is modern design for navbar..
2. He is not repeat logo in main section and navbar.. because repeat is can make bored.. but if we want show logo yii in main section.. we can hide its logo in navbar only on homepage and show when other page... many website do it..
3. Blue section with 2 button are download and take tour.. its good approach.. he guide user to do action.. "okey.. yii good but what next? What can I do? Please take action now"
4. Teks YiiFramework its unity and our brand... we cant break yii and framework.. teks "Yii Framework" good to... instead of lowercase

But for now.. @jacmoe have do many time and progress we should give help him to improve current project not create one new from scracth :)

I know that current design is anti mainstream.. and @muhammadcahya design is mainstream but we should remember that dark color.. and many text in first impression is mainstream in old trend design..

Now.. trend design is big, simplicity & softcolor

But forget it.. if we want force to anti mainstream..

My advice.. follow your feel.. You feel "I like your mockup @muhammadcahya" not mainstream or anti mainstream..

If we use dark color.. we should show a fantastic anything.. maybe with briliant logo.. but for safe we should use soft color.. okey yii have blue brand.. but soft blue..

Use universal looks forexample.. @eshill design good.. for me, for you, for samdark, and other.. my indonesian community like it too..

Follow Your feel @jacmoe .. I know You should pro..

Hem.. forget myadvice.. do best job...

We give to you opportunity to make official yii looks good..

I am only another yii lover

[eshill]

@hscstudio thanks!

[jacmoe]

Yeah, great work @eshill :)

However, I need to follow my train first before thinking about integrating ideas.

As for style, I am a huge fan of Mozilla.org's new site - it really moves me with it's strong, vibrant colours and sophisticated elements - I don't forget that I visited it:

[jacmoe]

I really appreciate your thoughts @hscstudio - thank you!

I really, really hope that I can do Yii and the awesome community justice :)

Call to action? The front has those - 3 and 3 - just under the jumbotron:

The buttons for the 3 action boxes should be styled better - I am thinking something like what Mozilla does on their homepage (mozilla.org)

[samdark]

@jacmoe these three are OK but not as strong as @eshill idea.

[jacmoe]

There are six - 'Relational and noSQL databases', 'Great tools' and 'Exceptional community' are buttons too.

'Download Yii' would just lead the user on a goose chase - I think it's better showing the command that you need to run to get a Yii project :)

I can put a big download button there but it would just lead to the Quick Start (tour) page or something. You don't download Yii, you generate a Yii project with composer.

Well. Perhaps later.

[albaraam]

Hi all, I have some thoughts I want to share with you guys.

First of all I wonder why did you guys start with front-end development? I suggest (following content first approach) to first have couple of designs for the new website, then we can make a simple poll (lets say for one week) to let the community participate in choosing which design is the best (more opinions => better decision). It's even easier to make changes during this phase.

you may be asking where can we get the designs? simply any one who knows a designer can ask him/her for a redesign of the home page (at least) in his/her spare time, and I think there will be many designers who would like to participate. And if you're okay with the idea, I can contact some designers I knew if they have time.

Actually what I want to say is that development is the last part of the process, and for design lets give it to who's expert in it.

Content ==> Design ==> Development

what do you think guys? @hscstudio @jacmoe @samdark @rob006 @SilverFire @muhammadcahya @eshill

[muhammadcahya]

Hi @albaraam Thank's for sharing, very interesting :)

I think about 'following content is first approach', Yes already exist (in current website, etc), because it's about 'rebranding'

Actually I was curious about the designers/expert who would you contact, I want to see it :) But what I see here, the design has been / is being made by @jacmoe , so there will probably be a bit of a clash of design Perhaps now is to respect the @jacmoe work, and then we can give a feedback about it, all the ideas we can accommodate here

That's my opinion, waiting for the master commented :D

[jacmoe]

As far as I can see, the process has been going on for quite some time now in private - keep in mind that the repository has only been made public a short while ago. :)

They have had contact with several designers and UX experts, and have gotten some advice/suggestions, but not nearly enough.

I was dragged into it due to my previous mockup, and am now working on what is to be replacing the current site.

We are open to suggestions and contributions, but I think it is not the time for initial design brainstorming - we are working hard to get this site ready to launch.

Specific advice is welcome, not complete overhauls - otherwise we won't be able to ship in time :)

I am painfully aware that I am not a master designer, so feel free to suggest and maybe fork and do PRs.

[samdark]

The main idea now is to get content / structure right. Then if design isn't OK, make it better. If it's OK then launch and improve as it goes.

[rob006]

Specific advice is welcome, not complete overhauls - otherwise we won't be able to ship in time :)

Is there any deadline?

[samdark]

Not really but we don't want it to take years to complete...

[jacmoe]

Is there any deadline?

No, not that I am aware of.. But there have been plans to launch a new site for ages now, and we are all getting impatient - and the current site is not doing Yii any favors (to put it mildly) - so I think that the sooner it gets launched, the better. :)

Edit: exactly what @samdark said.

Edit_again: And now is a very good time. The source code for yiiframework.com has just been open sourced, so let us strike while the iron is hot! :+1:

[rob006]

Yii 2.0 was released a year ago. For almost all this time there was no progress in creating the new page. Spending a week or two for real design is not such a big effort in this context. In fact, it can speed up work - spontaneous coding without any plan usually requires a lot of fixes and changes, and it is not as fast as it seems at the beginning.

[jacmoe]

What makes you think that we haven't ?

[rob006]

Because I'm not seeing any plan or final mockups? If there are any, where I can find them?

[samdark]

The plan is in issues: https://github.com/yiisoft-contrib/yiiframework.com/issues

[jacmoe]

If you care to take a look at the issues here, you will notice that the design has been discussed at length and at least one UX guy has been brought in, they have used moodboard, PDF etc., and - because the Yii team are very busy people, and UX guys tends to disappear - it all seemed to grind to a halt.

I started a topic - http://www.yiiframework.com/forum/index.php/topic/68490-new-face/ - and pretty soon I made a mockup where I presented my ideas of how a possible new Yii site would/could look like. And later, when the source code was opened, I began to contribute.

What I saw was a rough theme and I began to integrate my ideas into it, and I think we have made good progress.

Final mockup? I don't work that way - fortunately, I am not employed in a corporate environment where 'final mockups' are the norm. Agile is the way to go: do work, test, get feedback, improve, test, get feedback ..

[jacmoe]

I have tried to - and continues to - make sure that it is as easy as possible to change the looks of the site by making use of good practices and good tools - think of it as a framework for this site - building blocks. Gulp and Sass and Yii is a great combination :) So if we don't like that blue color? No problem: change one or two variables, and the color is different all across the site.

Responsive design and prototypes is the way to go - not mockups.

https://webflow.com/blog/always-choose-prototypes-over-mockups

((Edit: I can't for the life of me remember that article that started the whole move from mockups to prototypes - I'll post it, when I find it))

[rob006]

Seriously guys, this exactly we-have-no-real-plan-just-coding replies. :)

Currently new site code could stay closed - all work is done by collaborators, because others do not have anything to do here. As a coder I do not know how I could help, because there is no specific issues, which I could handle. If I was designer I will not spend my time for designing mockups, which probably will be ignored. You're basically close for community help.

[jacmoe]

I am not really sure what it is you are after.. All I know is that I was asked to try and take my ideas from the prototype that I made and integrate them with the site that sits in the repository we are discussing :) I tried to start a discussion in the Yii forum, but not many people participated.

Of course, as soon as the integration got started, people have started to appear with one mockup after the other - and that is good. Does that mean that I should stop integrating?

If you are the coding type, then a quick look at the issues would probably give some clues to what needs to be done. If not, then do open a ticket and ask what needs to be done :)

[cebe]

As a coder I do not know how I could help, because there is no specific issues, which I could handle.

The issues are mostly unclear because we have not defined everything in detail. E.g. user management needs to be created from scratch and we need a plan for that first. There is a milestone for issues that need to be done for the launch: milestones/launch. Some of them are vague because we need to find a plan for them but there are also concrete ones like #18 #46, #77. For the vague ones, you may propose solutions or discuss requirements with us.

[albaraam]

Thanks guys @jacmoe @muhammadcahya for reply, I think I got the idea as @samdark said it's all now about getting content / structure right. Even I think (as @rob006 mentions) that it's much easier to have a design (PSD) proven by the community then to start in development, since applying a design into html/css/js doesn't take that much of time if every thing is planned and agreed.

At the end we're all Yii Lovers and have the same goal (Make Yii's website the best), keep up the good work guys.

[rob006]

Does that mean that I should stop integrating?

Integrating what? There is no public project of main page, so I have no idea what and how you will integrate. I think so @eshill mockup looks much better and it's more practical than current implementation. I don't like current "Fast, Secure..." empty slogans in hero sections. @eshill slider with development steps is really great idea, far more better than current Quick Start section. Github ribbon is ugly. And putting The Definitive Guide and Class Reference into smaller navbar is ridiculous - documentation is mostly first thing what user search on framework page, and now we don't event have such a word on page. It's not just a colors, it's about the content layout, which is more difficult to change in the future.

[jacmoe]

At least you are being honest ;)

[jacmoe]

@samdark is the @eshill proposal available in source form? I think I am going to go for that instead.

[samdark]

Yes. I'll ask him.

[samdark]

Here it is: https://github.com/eshill/yiiframework.com

@jacmoe are you OK w/ sources in Sketch? If not, he can re-do in PSD. Also, which pages do we need additional design for?

[jacmoe]

I don't have a Mac or money :) Does the Sketch tool export to usable formats? Otherwise, I will just work using Colorzilla and the png.

[samdark]

OK. Will get PSD then.

[jacmoe]

I guess that none of you guys are willing to take over the design?

[samdark]

Design or HTML/CSS? @eshill would take care about design.

[jacmoe]

That sounds good. Yes, design. I don't want to be responsible for that ;)