DefinitelyTyped/definitelytyped.github.io

Content for new site

Opened this issue · 21 comments

What do we want on the new site?

Some certainties:

  • Links to outlets
    • Github repository (link to repos + .git url)
    • NuGet package manager (link to NuGet usage + link to query)
    • TypeScript Definition manager (link to dt.org/tsd + link to npm)
  • Guides (prominent)
    • Best practices
    • Contribution guide (prominent)
    • Creating a definition file
    • Pull Requests
    • ... option for more
  • TypeScript Directory
    • few sub sections
  • Pages (loose stuff)
    • Badges
    • Language issues
    • Website contribution guide
    • ... option for more
  • Definition index (what is now on dt.org/tsd but better) #14
    • search/filter/paginator
    • popup or subpage with
      • all info from header (project url, authors etc)
      • link to git, nuget, tsd cli command etc
      • deeplinkable (via #hash)
      • copy badge url with deeplink #13

What else?

Homepage:

  • 3 line intro
  • search box to index
  • contributors? team?
  • examples?
  • new ticker?
  • twitter ticker?
  • ???

Lets discuss, the first, most important thing? The 'links to outlets'.

I love the design, but from a functional standpoint I think:

  • the ideal case would be the three ways to get the definitions would be on the home page, in the dark blue area, weather as icons, buttons or something else.
  • may be we need the name with the logo itself
  • we can go with this slogan, or we can brainstorm a new one

This is a very interesting discussion.

It's great to see the ideas progressing.

It is important to recreate some areas of the layouts according to this discussion. Can we let the most attractive pages.

I think the most important thing is to be objective and think about the user experience.
Place a button package as mentioned in another post sebastian is cool.

We can reuse the area blog for a greater emphasis ...

I find it interesting to have a search bar on the homepage, maybe below the buttons of the top.
After all, this is one of the most important points of the site: you want to find the typing.

if (I == "wrong") {alert ("Correct me"); }

Perhaps it is interesting to focus on promoting the project and provide important shortcuts on the home page: the session "how to use" could turn into a page perhaps, or falls below other most important points, such as search, BTNS call to action, a brief explanation of what the project is, social networks and examples.

Here's an example of a packaging tool that puts search front-and-center. CocoaPods - think a workflow that looked something like.

  1. Enter search into search box on home screen
  2. When filtered results are displayed, clicking on an item gives several options to acquire the definitions
    • copy/paste install text for NuGet PM> Install-Package jquery.TypeScript.DefinitelyTyped and a link to the nuget site ex: http://www.nuget.org/packages/jquery.TypeScript.DefinitelyTyped/
    • TSD - not sure of a quick-copy-paste here, but a sample install command perhaps?
    • Copy/Paste raw text? (this I don't necessarily like because of dependencies between files, but still something to consider...)

Just throwing this out there as an option to discuss...

CocoaPods looks like a really good example how to focus on what the visitors want.
I like almost everything about their page.

CocoaPods example is pretty good.

For the 2) Instead of a raw-text copy-paste we can link to the Github repo blob page. User can view and copy etc.

I like the idea of putting the packages up and front. According to your comments, can we see this as being concluded?

Another thing CocoaPods does pretty good is its navigation structure (Home/About/Guide/Blog). Maybe the "Guides" and "Pages" sections could be combined into one section?

Hey, I don't think we need to discuss/agree on everything upfront ;)
We can do it step-by-step as long as some aspect is agreed upon.

I think first would be:
DT - logo + DefinitelyTyped on top left,
About + Guides on the right
Search field on the dark city landscape (and something else or not?)
Footer

Following these ideas, I created a new layout. See the new top: brief description of what the project is, and search buttons. I think this is the main on this page. And you?

The rest of the contents are good? Or think we need to change?

In the footer, I think we can highlight some advantages and maybe insert some pictures libraries we've ever done. And you?

https://cloud.githubusercontent.com/assets/1757632/3697700/818aee30-13ae-11e4-8e48-fbd6d9f173ec.jpg

Overall I like it.

One improvement could be to find a way to make the search stand out better, I glossed right over it (and I was looking for it...)

definitely_typed_header

What do you think?

When a user searches for something, a button to cancel the search appears.

Also illustrated the hover effect.

Looks better and better ;)

I think your original DT + text was strongest. I think the ideal (and final?) version for the logo would be:

  • uppercase DT
  • the square around it, slightly smaller (your judgement how smaller)
  • DefinitelyTyped - written like this and slightly larger font
    (and we can call it finished)

The other stuff is flawless.

Really, I liked this version very much. What do you think? =D

definitely_typed_logo

Nice, it's bold and calm as you are using only a single font size. I like it.

I agree with you @sebastian-lenz : simple, modern and pleasant.
Everbody agree to keep this logo?

Yep, I like it too. ;)

Next step: get the blue square part and use it everywhere instead of the ugly one we have now.

👍

Looks way cool - well done!

http://definitelytyped.org/pages/language-issues.html is out of date now, right? I think some of those issues have been addressed (e.g. union types, tuple types), and links should go to GitHub?