sandstorm-io / sandstorm-website Goto Github PK

Hello,

The Sandstorm.io site does not look good at all on tablets (or at least Nexus 10 in landscape, but others too I'm sure). It's scaled up as if it were a giant phone. It's actually hard to read that way. There are a lot of tablet users nowadays, this could be hurting you.

The problem is in your header:
<meta name="viewport" content="width=480">

I'm happy jump in and try to fix this up for you. Is the site hand-coded or do you use a static site generator to create the files visible here?

Action items:

• /developer - add high-contrast button to bottom with link to developer portal
• /developer - "See Developer Documentation" => "See Developer Portal"
• on homepage: Rename: "Documentation" "Developing" to be "Documentation" "Developer portal"

Mark this as resolved when all the changes in the milestone are live.

Current screenshot:

Related to #234

FWIW, the standard thing to do here is use a hamburger menu on mobile. Not that I like hamburger menus, but I think our strategy of dropping things from the top bar is unusual.

I agree with @kentonv that it's unusual to drop things from the nav bar. Our website is not currently designed to enable users to navigate easily from any page to any other page so dropping items from the nav bar only makes navigation more difficult for users. I'd like to design a hamburger menu that will display links to pages at widths where isn't sufficient room in the nav bar. I'd like to find a solution where we can have a hamburger menu and at the same time not lose all information scent.

1. This landing page should be updated to use the term "Productivity suite". We should also remove/replace the string "open source dashboard for productivity tools"
2. User (in user testing) wanted to see all apps offered but did not succeed- they were not aware they could access the App Market by clicking the discrete "App Market" link. We should make it a button in a more visible call-to-action section.

Other thoughts:

• We should emphasize collaboration.
• "...keeping ownership of your data" is not compelling for all education users. Many schools can use SaaS. Perhaps we can think of something more compelling to put here.
• We should use mention integration with their existing Single sign-on
• Subheader for "Here's why IT teams love it" should focus on how Sandstorm saves them time, effort, etc. rather than highlighting what instructors and students gain. (Also, we already mention what instructors and students gain in the top half of the page.)

Current landing page:

Some options:

• perhaps an e-mail icon visible on the nav bar
• an obvious "email Sandstorm/us" link or button
• links to individual emails in the team section
• contact form

This issue can be closed when the graphics are merged into the productivity-suite branch.

We can do better than this!

I'll own the task of coming up with designing a simple graphic with a link to our home page.

User asked if Oasis came with Sandstorm for Work features like LDAP, SAML.
Additional comments for context:

• "Features page has "Business" then when you select that tab you see the "Sandstorm for Work"...
  I almost expect to see a "sandstorm for work" feature list somewhere but I'm not sure if I found it.
• "Oh, apparently in one place it is "standard" and another it is "core & security" (and I'm just guessing they are the same)"

I think there are at least 2 things we need to do here:

1. Describe what each option of Sandstorm comes with. I'm aiming to address this with #233
2. Keep our language/labeling cohesive so that users can mentally match the different Sandstorm options to the Features pages

I'm excited to see if people have other ideas too! :)

We should make sure the website properly informs people that Linux 3.10 is adequate, once the code in sandstorm-io/sandstorm#2644 is the default during an install.

One question I get a lot during user testing is "What apps does Sandstorm have?". Although we have some links throughout the website leading to the App Market they're not easy to find.

We should:

• add "Apps" to our top nav linking to the App Market
• add "App Market" to the footer nav to also link to the App Market

Right now, on https://sandstorm.io/apps/ , the button tags use an onclick parameter to a Javascript function.

It'd be nice to change that in the following ways:

• Use a HREF, rather than a complicated Javascript thing
• Have the HREF, by default, start the app in the demo.

Rationale:

• This way, people can click the "Try it" button on showing up to https://sandstorm.io/apps/ and it'll actually do something.
• Fans of ported apps like MediaGoblin can right-click copy-location and get a URL they can pass around to random people they meet who they wish to expose to their awesome project.

Implementation notes:

• This requires storing the appId (the public key of the author) in the page in a machine-readable format. To get the appId you might have to download & unzip the SPK and pull it out of the manifest.
• This requires changing the Javascript to read the appId from this machine-readable format, such as a data-app-id attribute, see also https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes
• This requires changing the Javascript so the instance chooser at the top of the page causes all the HREFs to change. (Arguably the button text should change from "Try it" to "Install" when you choose something other than the demo. Or maybe the button text should always be "Install".)

https://sandstorm.io/features - "48 apps and growing"
https://oasis.sandstorm.io/ - "over 50 apps available"

:(

User: "Agh! According to this page I now need to pay $15/user/month. Not the $5 or $10 on the web site."

The pricing on /get is correct.

Steps to reproduce:

• As a prospective customer who is using Sandstorm Standard just fine,
• Go to https://sandstorm.io/business and see if there is anything they want to pay for,
• Notice that there's only mention of features, not support,
• Therefore skip purchasing Sandstorm.

Expected behavior:

• https://sandstorm.io/business lists all of the things that Sandstorm for Work includes, including Priority Support.

@neynah @kentonv @JamborJan curious for your thoughts!

We can do better than this!

I'll own the task of coming up with designing a simple graphic with a link to our home page.

This issue can be closed when there's a successful PR that adds the graphics to the area of the page describing Wekan, Rocket.Chat, Davros, & Etherpad into the productivity-suite branch.

We display how many grains comes with each option of Sandstorm on https://sandstorm.io/get, however, we don't provide any information as to what a grain is to aide decision making.

I think it's worth adding a footnote or linking to text somewhere else(perhaps docs) to explain what a grain is.

Hi,
when I'm at https://sandstorm.io page, and click "60 second demo", it looks like demo is running for 60 minutes, according to counter?

BR,
xet7

At https://sandstorm.io/features the heading about authentic apps, where you can see who created the package with verified PGP signature and stuff... shows a picture of the auto-update drop down. This seems like a disconnect, since nothing about that image shows the verified author stuff, which might be better represented by a shot of the author block on an app.

So, as a static-published website, this isn't inherent, and would likely require manual maintenance, but... there's no RSS feed for the blog, which is really odd.

One could suggest there is a mailing list sign up on the right, but things that end up on the blog don't end up on the mailing list. Technically I am notified of every blog post anyways, but that's only because I'm the sort of hyper-attentive nerd who is subscribed to the sandstorm-website repo, which I assume is abnormal. ;)

We need a sidebar widget on the blog with:

• sign up for announcement list
• links to social (twitter, fb, github)
• try the demo button
• pre-order button

That widget should also be in the demo. ^_^

Every user tested has so far expected to see a demo video somewhere. Not sure how high this is on the priority list but we should get to it at some point.

https://sandstorm.io currently serves a Strict-Transport-Security: max-age=31536000 header, which is phenomenal. It'd be even more phenomenal if it had the includeSubdomains option, and was in the preload list.

To avoid confusing the two, maybe we can reduce the font size/weight of subheaders and also consider removing the purple hr below.

It occurs to me that it's unclear what people are actually getting with any of these options of Sandstorm. Even with Sandstorm Oasis, we display prices, storage, and grains listed but fail to explain what Sandstorm features they're getting. For example: single sign-on, access to all apps on the App Market, multiple identity support, search, etc. I propose we list the benefits/features people will get with each option of Sandstorm and I will implement the changes on https://sandstorm.io/get.

Here are some examples of other pricing tables with features listed:

https://redbooth.com/pricing

https://slack.com/pricing

https://evernote.com/pricing/

(using this project since @neynah doesn't have access to the "prod" repo, and as far as I know, there's no git repo for the Oasis splash page anyway)

@neynah see below screenshots. Requesting your +1/-1 on the phrasing.

Once we have your +1/-1 I will request that Kenton make the change.

Before is on the right. After is on the left.

raw diff, for Kenton's convenience in the future.

diff --git a/index.html b/index.html
index 2456c49..70d357b 100644
--- a/index.html
+++ b/index.html
@@ -12,6 +12,8 @@

 <p>Install apps with one click to chat, store files, collaboratively edit documents, and more. <a href="https://apps.sandstorm.io">Over 50 apps available</a> – or upload your own!</p>

+<p>Sandstorm is a self-hostable web productivity suite. This site &mdash; Sandstorm Oasis &mdash; is our hosted offering, with plans starting at $0/month.</p>
+
 <p><a title="Demo Rocket.Chat" class="demo" href="https://oasis.sandstorm.io/appdemo/vfnwptfn02ty21w715snyyczw0nqxkv3jvawcah10c6z7hj1hnu0"><img src="rocketchat.jpg" alt="Demo Rocket.Chat" /></a> <a title="Demo Wekan" class="demo" href="https://oasis.sandstorm.io/appdemo/m86q05rdvj14yvn78ghaxynqz7u2svw6rnttptxx49g1785cdv1h"><img src="wekan.jpg" alt="Demo Wekan" /></a> <a title="Demo EtherCalc" class="demo" href="https://oasis.sandstorm.io/appdemo/a0n6hwm32zjsrzes8gnjg734dh6jwt7x83xdgytspe761pe2asw0"><img src="ethercalc.jpg" alt="Demo EtherCalc" /></a></p>

 <p>Oasis is run by <a href="https://sandstorm.io">Sandstorm.io</a>. Rather use your own server? Sandstorm is Open Source: <a href="https://sandstorm.io/install/">Run your own »</a></p>

Right now, when visiting the app store list, it's unclear that one can port apps.

So we should make that clear!

On mobile:

• "Get Sandstorm" should always display if there's room
• "Blog" should display if there's room

On desktop:

• Remove "About" from top nav
• Remove "How it works" from top nav
• Remove "Code" from top nav
• Keep all these happily usefully living on in the footer.

Expected measureable results:

• Greater fractional clicks to "Get Sandstorm" from homepage viewers
• Greater fractional clicks within CTAs within the various exit areas within "Get Sandstorm"

Probably will be implemented as an overlay when the user clicks a "Pricing" link on /get under "Sandstorm on Oasis".

The current screenshot of the App Market on the frontpage looks like this (the old app market with the sidebar):

It should probably reflect reality.

sandstorm-io/sandstorm#2644 makes Sandstorm compatible with many, many more Linux distributions, so it'd be smart to write a blog post about it, and probably make sense to send that to the announcements email list.

User indicated that it seems like a "SUPER important and great feature" that should be mentioned on the front page. Also that it may be nice to say "Powerbox connects your apps" and have a powerbox link to /core#powerbox.

Perhaps we can queue this type of change for when Powerbox ships? 😄

A nice person asks in #userops:

paulproteus, what is the license of that image at the top of the page

We should choose a license for the blog content. I propose we license it as CC Attribution 4.0 International https://creativecommons.org/licenses/by/4.0/. We should probably add a clear trademark statement somewhere, too. I can make a wiki page called "Blog license" or something to address this.

@kentonv @jadeqwang requesting your +1 or -1 on CC Attribution 4.0 International.

Purpose of this issue:

This issue is closed when Kenton is completely satisfied with the text changes for the website to accommodate the new focus on explaining what Sandstorm is.

Probably what will happen is:

• @neynah will submit a pull request with 80%-OK text.
• @kentonv will leave comments on that PR.
• Once that's done, we'll close this issue.

A user complained that the site looked wrong in Firefox. Somehow, Firefox is defaulting to a gray background for him, rather than white. I don't know why, but it is technically true that the default background color in unspecified, and it doesn't look like we're setting background: white on <body>, which we should.

(Submitted by @kpreid here)

1. Go to https://apps.sandstorm.io/
2. Scroll down.
3. Click on an app to get the details.
4. Go back.
5. The scroll position is lost.

This is especially annoying on small (phone) screens.

(Please consider having the server actually deliver the list in HTML. Then the layout will be prompt so this won't happen, and it's friendlier to machine readers anyway.)

User during testing indicated that many systems allow for companies to do in-house additions and that we should mention somewhere that if a company wants extra features they can build their own apps.

Although it's not a business only feature, I agree that we should make it more clear that it's possible and encouraged to package in-house apps.

https://sandstorm.io/docs is currently 404 but, I suggest, should be a redirect to https://docs.sandstorm.io/ for the benefit of people who try to remember URLs and fail.

The three “Learn More” buttons of the “Who is it for?” section of the home page aren’t working on my browser (Firefox 45 on Ubuntu).

Here is a screenshot:

I imagine we can fix this reasonably straightforwardly. I figured I'd file a bug report here even though the Sandstorm blog is not in this repo, so that we don't forget to fix it entirely.

As interpreted by NetNewsWire 4 for Mac, https://sandstorm.io/feed.xml contains no entries. Unfortunately, I could not extract any information about why.

(Though feed validators say that it is encoded as UTF-8 but not declared as such in the Content-Type.)

How 'bout you switch to Atom? :)

From user testing it seems that users would prefer to try out a demo of Sandstorm before purchasing or creating an account. We should make the demo more visible and accessible. We currently only have 2 links on the home page.

I think we should also add the demo as a:

• footer link
• button/link on /get

As a result of changes in #233, our "Features" page will now have subpages for "Sandstorm Standard" features, "Sandstorm for Work" features, and also "Developer" features. "Developer" features now seems a bit out of place since the other subpages are dedicated to user-facing product features:

In the future I think we should:

1. Consider moving all Developer features content into docs or onto it's own separate page on our website. Although it's important to communicate why developers should develop on Sandstorm, I suspect Developer features just doesn't quite fit into the customer's mental model when they're shopping for Sandstorm. @zarvox and I think the main purpose of our Features/Products page on our website should be to communicate our user/admin-facing product features.
2. If we move Developer features elsewhere then we can could rename "Features" to "Products"; this page could then list our 3 product options: "Sandstorm Standard", "Sandstorm on Oasis", and "Sandstorm for Work". Then we would have clean links between product options on /get to the Products section of our website where users can learn more about each of the products in greater depth.

Smaller but related changes:

1. Consider removing "Code" and "How it Works" from the nav bar and either move the content into docs and/or link to them from the footer & from other places on our website.
2. Change pages linked in our nav bar at smaller widths. In "tablet" view we emphasize "Features", "How it Works", "Blog", and "About". In mobile view we emphasize "How it Works" and "About", and in more extreme cases just "How it Works". I think we should enable users to easily navigate to more product & information focused pages. For mobile I propose: "Get Sandstorm" and "Blog". For tablet I propose: "Get Sandstorm", "Features, "Blog", and "Docs". I'm open to other suggestions!

The rationale behind these changes is to achieve better information architecture that better maps to the user's mental model to aid them in becoming more informed about Sandstorm & its offerings as well as make a decision about using/purchasing Sandstorm.

Rationale: nearly zero mailchimp updates come from this.

Overall goal, if I understand @jadeqwang 's request correctly:

• An enterprise IT-type person should be able to visit Sandstorm website and successfully and easily click from start to finish on a flow that results in them knowing that Sandstorm for Work costs money, and that they can start a free trial, and that results in them knowing how to do an install.

We had discussed the goal that they should be able to immediately pay for a Sandstorm for Work feature key, but I personally believe that's a bad primary thing to ask people to do because I think that they should be directed to the install flow instead because doing an install is what allows people to discover that Sandstorm is valuable for them.

Given the above goal, proposed flow:

• home page: No changes; user would click "Get Sandstorm" and navigate to /get
• /get: User would click "Start a free trial" and this would take them to /install (right now it takes them to the feature key tool)
• /install: This page should be modified to include information about Sandstorrm for Work trials, and should de-emphasize the specific command to do the install, and instead point people at https://docs.sandstorm.io/en/latest/install/ since corporate-minded users might want to do things like set up Sandstorm via Ansible/Puppet/Docker and the curl | bash instructions are scary for people with that mindset.
• /install: There should be a call to action to "Send this page to a colleague" which has an email input, because sometimes it's not an IT person visiting the Sandstorm site but instead a business/marketing/etc person
• Review the text on the feature key vendor page and make sure it makes sense in context to people

@jadeqwang @neynah curious for your discussion/+1/-1. I want to gather feedback by end-of-day Friday July 22 so I can implement changes by Friday July 29; the changes are going to be easy, but the feedback/discussion before it might be long. If no one provides feedback soon I'll probably submit a pull request for discussion.

I suggest that for image purposes, it's ideal if Sandstorm.io's website isn't loading resources unnecessarily from Google. It should be trivial to switch to having the fonts stored with the website.

None of the top-level nav items hint clearly at what I should do if I'm a confused user and need support. The closest is arguably either Docs or Community. There's nothing on the Community page that really points to "how do I get a question answered?" - it's more about "how can I get involved/contribute". If you're willing to poke around, you might find the "Live Chat" link on the community page, but it's somewhat subtle.

There is a single Contact link in the footer of every page, and from what I hear, we get some amount of support-related traffic through it, when that address is not intended as a support entry point.

Having better information scent for this might improve the getting-questions-answered experience for users.