New homepage #555

sethladd · 2017-05-12T16:12:35Z

Fixes flutter/flutter#9671
Fixes flutter/flutter#9609
Fixes flutter/flutter#9608
Fixes flutter/flutter#9578
Fixes flutter/flutter#8896
Fixes flutter/flutter#8718
Fixes flutter/flutter#9300
Fixes flutter/flutter#9623

FlutterBot · 2017-05-12T16:22:13Z

Staging URL Generated At https://flutter-io-deploy-two.firebaseapp.com . Please allow Travis Build to finish to view the URL.

Hixie · 2017-05-12T16:29:13Z

feedback from someone looking at this on mobile: there's no left margin, the text starts at pixel 0

sethladd · 2017-05-12T16:32:32Z

Thanks!

Hixie · 2017-05-12T16:33:19Z

If I make my page narrow on desktop, the text goes off the left edge entirely.

jhirth · 2017-05-12T17:23:32Z

There is no prominent link to the FAQ (/faq/). Was this a deliberate omission?

sethladd · 2017-05-12T17:25:10Z

Good catch on the FAQ, thanks!

sethladd · 2017-05-12T17:47:06Z

Added FAQ.

Known issue: the footer behaves weirdly sometimes. Will address in future PR.

Identified the source of the non-responsiveness. Can fix in this PR.

Can fix the top toolbar not responding soon enough in this PR.

InMatrix · 2017-05-12T18:34:54Z

index.md

+                <div class="homepage__key_point_title">Used by Google</div>
+
+                <p>
+                Flutter is used by Google, works with Firebase


Maybe it's worth saying Flutter is used by Google and others? I'm a little worried that some people wonder if it's used by Google only.

Added "and others"

InMatrix · 2017-05-12T18:37:06Z

index.md

+            </div>
+
+            <div class="homepage__key_point">
+                <div class="homepage__key_point_title">Used by Google</div>


Will "Used in production apps" better capture the content (e.g., Firebase and other SDKs) below this heading?

added "in production"

InMatrix · 2017-05-12T18:39:04Z

index.md

+    </section>
+
+    <section class="homepage__hot_reload">
+        <h1>Fast development</h1>


Adding the lightening bolt icon next to "Fast development" is likely to help users discover the feature, once they are in the IDE.

Can you link me to the icon that we have the rights to use? Happy to add it here. Bonus if it's an SVG that I can embed :)

@devoncarew Do you have the source image of the Hot Reload icon?

we have a 32x32 png (https://github.com/flutter/flutter-intellij/blob/master/resources/icons/hot-reload%402x.png)

If you want a larger image, there is one that's similar but not identical which I could dig up.

InMatrix · 2017-05-12T18:43:25Z

index.md

+        <p>
+        Delight your users with Flutter's built-in
+        beautiful Material Design and
+        Cupertino (iOS-flavor) widgets, rich motion APIs,


Can we have GIF or embedded video to show "motion" and smooth scrolling? At the minimum, a link to a video demo on YouTube would help support our claims.

Totally. I want to try to use HTML5 video for this.

InMatrix · 2017-05-12T19:42:14Z

index.md

+        </p>
+
+{% prettify dart %}
+class MyMessage extends StatelessWidget {


This snippet is short and sweet, but it doesn't show the reactiveness of the framework. How about use this snippet: https://flutter.io/widgets-intro/#changing-widgets-in-response-to-input?

Let's give it a try.

InMatrix · 2017-05-12T19:44:00Z

index.md

+{% endprettify %}
+
+        <p>
+        Browse the <a href="/widgets/">widget catalog</a>


It might be more useful to have the link to the Widget Catalog in the "Expressive, beautiful UIs" section.

InMatrix · 2017-05-12T19:50:12Z

index.md

-typography, icons, and more.
+        <p>
+        Learn more about what makes Flutter special in the
+        <a href="/technical-overview/">technical overview</a>.


This page currently doesn't show up in the side navigation.

Good catch. Added.

InMatrix · 2017-05-12T19:50:45Z

index.md

-## Why use Flutter?
+        <div class="homepage__button_row">
+        <a href="/getting-started/" class="get-started-button">Get Started</a>
+        {% include note.html content="_Flutter is an alpha, open-source project_." %}


Add something about how to give us feedback here?

We used to have that, but now there's a Support link on every page on the website.

InMatrix · 2017-05-12T19:52:35Z

@sethladd Thank you for putting this new homepage together. It looks very nice overall. Please see my inline comments for some potential tweaks.

christian-lefty · 2017-05-12T20:58:51Z

I would suggest that most of the stuff in the Unified app development section be links to relevant doc

sethladd · 2017-05-12T21:58:57Z

I would suggest that most of the stuff in the Unified app development section be links to relevant doc

Thanks! One of the things that this exercise is pointing out is that we need more docs for some things, and to bring some docs over to flutter. :)

mit-mit

Just some smaller comments. Overall a great improvement!

I wonder if the 'cards' would look more consistent with the overall design if they used the same styling as the smaller ones here: https://flutter-io-deploy-two.firebaseapp.com/widgets/

mit-mit · 2017-05-14T22:53:13Z

support.md

+
+We're open source and would love to hear from you!
+
+We encourage you to reach out and


More short lines

short lines are fantastic for tech writer reviews. I was trained to do this :)

mit-mit · 2017-05-14T22:55:46Z

index.md

@@ -1,213 +1,297 @@
 ---
-title: Welcome to Flutter
-sidebar: home_sidebar
+title: Easy and fast SDK for beautiful apps


s/apps/mobile apps/?

maybe? do people think apps != mobile, these days?

mit-mit · 2017-05-14T22:56:20Z

index.md

+
+    <section class="homepage__key_points">
+        <h1 class="homepage__title">
+        Flutter makes it easy


Why are there so many super short lines? Why not just wrap at 80?

mit-mit · 2017-05-14T22:57:20Z

index.md

+    // build methods fast, so that you can just rebuild anything that
+    // needs updating rather than having to individually change
+    // instances of widgets.
+    return new Row(


This code doesn't actually compile. It complains that a RaisedButton needs to be inside a Material parent.

Good catch. I think I took this from another page on our site.

Looks like this still isn't fixed?

Not clear this needs to have a Material. Can you have a Material inside another Material? This widget is intended to be inside another build() of something that has material.

But, we'll merge, and chat about a better sample.

mit-mit · 2017-05-14T23:00:36Z

index.md

+        </p>
+
+{% prettify dart %}
+// From https://github.com/flutter/flutter/tree/master/examples/platform_channel


Maybe move the 'From' link outside the code section, and make it a link to the sample.

I think I tried that, but I'm happy to try again.

mit-mit · 2017-05-14T23:01:24Z

index.md

+        existing Java/ObjC/Swift investment.
+        </p>
+
+        <div class="feature-lists">


These lists look a little odd. Maybe they should be links?

One insight from this exercise is that we have a ton of awesome capabilities in our system, but we don't always have docs that link to the specific feature or capability. Agreed that many of these items can and should be links. I'll try to find links for the subjects that do have a natural documentation for them.

sethladd · 2017-05-14T23:29:21Z

@mit-mit not sure I'm going to keep the "cards". If we do, agreed we should make them consistent.

sethladd · 2017-05-15T00:14:09Z

@InMatrix @eseidelGoogle @mit-mit I'm at the diminishing returns stage of this PR. Can you PTAL ?

After this lands, I want to fix the code samples on small screens. They should scroll horizontally. And, add more links for the feature list.

eseidelGoogle · 2017-05-15T02:00:34Z

Do I need to wait for the stage bot to do it's thing?

sethladd · 2017-05-15T17:29:52Z

It's all set: https://flutter-io-deploy-two.firebaseapp.com/

eseidelGoogle · 2017-05-15T17:51:01Z

The code example in the "Modern, reactive framework" doesn't feel very compelling.
The "Unified app development" section has a wall of buzzwords, but I'm not 100% sure what it's telling me (SEO?)

But honestly this is much better at selling Flutter (rather than explaining/onboarding as we'd previously chosen to do), so I would just press the button and ship it. lgtm. We will iterate from here.

sethladd · 2017-05-15T17:56:46Z

doesn't feel very compelling

Any thoughts on would would make it more compelling? We can write something custom for the homepage.

cc @InMatrix

wall of buzzwords

This is intended to do a few things:

Convince new users that we're "full stack". We have what you need.
SEO
Provide a basis for further docs and links

mit-mit · 2017-05-15T18:10:29Z

My only remaining concern is that the code snippet shown under Modern, reactive framework still isn't valid code, but I'd be to see a bug opened for that and then handle that post merge.

LGTM

sethladd · 2017-05-15T18:14:44Z

Thanks for taking a look!

InMatrix · 2017-05-15T18:23:40Z

Sorry about the delayed response. Yes, LGTM. As I mentioned previously, I'd love to see animations to show our performance and motion capability in the "Expressive, beautiful UIs" card.

sethladd added 2 commits May 12, 2017 08:55

new homepage and various fixes and tweaks

fb26027

update screenshot

c62dfd0

googlebot added the cla: yes Contributor has signed the Contributor License Agreement label May 12, 2017

fix linter and 404 issues

fdd059c

tweaks from review

26aee87

InMatrix reviewed May 12, 2017

View reviewed changes

sethladd added 4 commits May 13, 2017 14:53

WIP

6fea8e8

WIP

e331726

missing image

1bf1fae

fix code sample

677ecaa

mit-mit reviewed May 14, 2017

View reviewed changes

tweak style

5505e6b

sethladd added 3 commits May 14, 2017 16:48

make homepage cards look like other cards, remove unused JS

32a1c5f

fix bug with top nav on desktop narrow

571fb80

tweak footer

635c7a0

sethladd requested review from InMatrix, eseidelGoogle and mit-mit May 15, 2017 00:18

remove unneeded styles

cb3ece2

sethladd merged commit 775bad8 into master May 15, 2017

sethladd deleted the new-homepage branch May 15, 2017 18:14


		We're open source and would love to hear from you!

		We encourage you to reach out and

Navigation Menu

New homepage #555

New homepage #555

Conversation

sethladd commented May 12, 2017 • edited

FlutterBot commented May 12, 2017

Hixie commented May 12, 2017

sethladd commented May 12, 2017

Hixie commented May 12, 2017

jhirth commented May 12, 2017

sethladd commented May 12, 2017

sethladd commented May 12, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

InMatrix May 12, 2017 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

InMatrix commented May 12, 2017

christian-lefty commented May 12, 2017

sethladd commented May 12, 2017

mit-mit left a comment • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sethladd commented May 14, 2017

sethladd commented May 15, 2017

eseidelGoogle commented May 15, 2017

sethladd commented May 15, 2017

eseidelGoogle commented May 15, 2017 • edited

sethladd commented May 15, 2017

mit-mit commented May 15, 2017

sethladd commented May 15, 2017

InMatrix commented May 15, 2017

sethladd commented May 12, 2017 •

edited

InMatrix May 12, 2017 •

edited

mit-mit left a comment •

edited

eseidelGoogle commented May 15, 2017 •

edited