Greg DeVore's Weblog

Redesign Coming to ScreenSteps Live

gregdevore — Thu, 26 Jun 2008 01:34:04 +0000

Sometime in the next week or so we will be pushing some changes to ScreenSteps Live that we wanted to let you know about. The changes are mostly cosmetic but we have also reorganized some of the menus to make things a little easier to get to.

New Tabs

We have changed the main navigation to tabs. We thought that this would make the navigation a little easier to understand.

Admin Tab

You will also notice that the "Account" tab has been renamed to "Admin". This tab only appears to admin users on your account. We have also re-organized the settings under the new "Admin" tab. This is where you can do your bulk editing of Lessons, Manuals, Comments, Readers, Groups and Users. You will notice that the account settings are no longer in this section.

Settings

You can now get to the settings here.

Settings Tab

When you click on "Settings" (1) you will now see a new "Settings" tab (2). Here you can edit your profile, account settings, and, if you are the owner of the account, your plan and payment details.

Plan and Payment Settings

Here you can upgrade/downgrade, update your billing information as well as cancel your account.

Other Stuff

We have also improved the screens for creating new users, groups, readers, etc. We hope that you like the new look!

Redesign Coming to ScreenSteps Live

gregdevore — Thu, 26 Jun 2008 01:22:42 +0000

New Tabs

We have changed the main navigation to tabs. We thought that this would make the navigation a little easier to understand.

Admin Tab

Settings

You can now get to the settings here.

Settings Tab

When you click on "Settings" (1) you will now see a new "Settings" tab (2). Here you can edit your profile, account settings, and, if you are the owner of the account, your plan and payment details.

Plan and Payment Settings

Here you can upgrade/downgrade, update your billing information as well as cancel your account.

Other Stuff

We have also improved the screens for creating new users, groups, readers, etc. We hope that you like the new look!

What’s New in 2.1

gregdevore — Wed, 25 Jun 2008 22:22:54 +0000

ScreenSteps 2.1 is finally released! It has taken awhile but we think that you are really going to like this update. I just wanted to highlight a few of the key enhancements in ScreenSteps 2.1, namely:

The Post to Blog feature

Improved PDF output

Improved PDF manuals

Post to Blog

One of the most exciting things about 2.1 is the new Post to Blog feature. You can now post to your WordPress, TypePad or Movable Type blog. Just go into your ScreenSteps preferences, create a new web account, choose the account type and you will be all ready to post lessons instantly to your blog. You can even choose which category you would like your post to appear in, or publish the lesson as a draft. If you like to create tutorials for people we think that you will find this to be a great way to get your lessons out.

Improved PDF

We have also dramatically improved the PDF quality. In previous versions of ScreenSteps some images could appear a little blurry. In 2.1 this has really been improved. Look at these two PDF files. See the examples below.

Old PDF Output

Notice the blurriness in the header image and the screen capture.

2.1 PDF Output

Here you can see how much clearer the PDF export is.

Improved PDF Manuals

For users of ScreenSteps 2 Pro we have also really improved PDF manuals. In ScreenSteps 2.0 you could export a PDF manual but the cover page and table of contents looked a little shabby.

In 2.1 you can now add an image and footer to your title page and the table of contents now has better formatting and page numbers.

Title Page

Here you can see the new options for the title page. You can now add a footer and image.

Improved Table of Contents

This is the new PDF table of contents. The formatting has been cleaned up and page numbers are now included.

Conclusion

There are also a lot of bug fixes and small improvements. We hope you like all of the additions.

Simplify Your Documentation

gregdevore — Wed, 25 Jun 2008 22:21:25 +0000

In this post I am going to show you a very simple way to get your documentation done using ScreenSteps. Your results may be a little different than what you are used to but if you follow this approach you will find that your manual will be much easier to create and much easier for your users to read.

Answer Questions

What is the purpose of your manual? In most cases the purpose of the manual is to make it so that your user does not have to email or call you to find out how to do something. That really is the point, but few manuals are written with this in mind. I see a lot of manuals that talk about the philosophy of a product or the architecture behind it. I personally have never had a tech support email or call come in that asked me about the philosophy, the design or architecture of a product. Tech support calls usually start with "How do I …?"

Well, if we are trying to decrease support requests with our documentation then we should probably answer the questions that our customers have. The good news is that this actually makes your documentation a lot easier to create.

To show you how to do this I am going to create a manual on how to use WordPress. Now, I am not going to actually complete the entire manual but I will show you how I would scope things out. Once you have things scoped out in ScreenSteps it is actually very easy to go back and fill in the lessons you have outlined.

Create a New Manual

First I will create a new manual in ScreenSteps.

And give it a name.

Now I have a manual with nothing in it. To get things started I am just going to write down the questions that people might ask. Each question will be a new lesson. I don’t really need to do any planning at this point. I am just going to write down the questions as I think of them. (Note: You may prefer to do this in your favorite outline application first but I will show it in ScreenSteps).

To do this in ScreenSteps just select the New Lesson icon.

Here you can see that I have a list of questions that a user might ask. Now, as I look at these, some, like "How do I Upload a File?" are pretty easy to answer in just a few steps. But some, like "How do I Install WordPress?" might take a little more explanation.

For my next step I am going to organize these a bit. Some of the questions I will split into new multiple lessons to make them a little easier to create. I personally hate creating long lessons. They are a pain to make and boring to read.

Lessons Reorganized

Here you can see how I have reorganized things a bit. I have created a couple of sections (1) and have organized the lessons underneath each section (2).

Fill in the Lessons

All I need to do now is go back and fill in the lessons. Since the lesson title is a question it is really easy for me to decide what I need to do. I just need to create a lesson that answers the question. Once I am done, I might rename the lessons a bit. For example, I might change "How do I Upload a File?" to "Uploading a File to WordPress" but that is largely a matter of personal preference.

Conclusion

That is pretty much all there is to it. Try it out for yourself. I think that you will find that in a single afternoon you can have some pretty complete documentation that will be easy to create, easy to read and will be easy to update in the future.

If you want to get really fancy, then try this with ScreenSteps Live. Then, whenever a customer asks a question that you didn’t cover in your manual you can just add the answer to your online manual. We have been doing that for about 6 months now and it has worked really well.

Subscribing to a Podcast in iTunes

gregdevore — Fri, 20 Jun 2008 18:53:25 +0000

Subscribing to a Podcast in iTunes

This lesson will show you how to subscribe to a podcast in iTunes.

Select Podcasts

Select Podcast Directory

Select Podcast

In this example I selected the TWIT podcast.

Select Subscribe

Confirm

You will be asked if you actually want to subsribe. Click Subscribe.

Select Podcasts

Done

You can now see that you are subscribed to the podcast. You can see a list of all the episodes by clicking on the triangle (1). If you want to get old episodes, click on the Get icon (2).

Adding a Sidebar to Your Manual

gregdevore — Mon, 21 Apr 2008 18:06:41 +0000

Adding a Sidebar to Your Manual

This lesson will show you how to add a sidebar to your manual on ScreenSteps Live. Here you can add links to your main site or other information that your users might find useful.

Select Add a Sidebar

Enter Sidebar Text

Enter the text you would like to appear on your sidebar. You can include basic html tags. Once you have finished, click Save.

The message will appear to the right of your manual.

Emailing a Link to a Page from Safari

gregdevore — Fri, 18 Apr 2008 21:39:30 +0000

Emailing a Link to a Page from Safari

Go to Page

Load the page you want to send in Safari.

Select File > Mail Like to This Page

An email message will be opened up with a link to the page.

Ajax Outlines

gregdevore — Wed, 19 Mar 2008 04:32:36 +0000

I created an AJAX page using Rails that had a lot of drag, drop and reordering functionality. Getting it up and running wasn’t too bad but I kept running into problems that dropping an element in one area would make another non-sortable. This lesson shows what I was trying to accomplish, the problems I ran into and how bug tested and solved them.

NOTE: I have no idea if this is the best solution. It is just what I came up with. Any suggestions to improve it would be great. I should also note that this solution doesn’t work in IE, just Firefox and Safari.

The Goal

For our ScreenSteps Live we wanted to have a very interactive way of assembling lessons into topics. Lessons (1) are like individual blog posts and Topics (2) are basically online manuals. To assemble topics you basically create an outline of lessons. But the lessons already exists so you need to be able to drag and drop them on the Sections of the Topic. Sections (3) are just groupings of lessons in a topic.

So, first I want to be able to drag a lesson (1) onto a section (3). That is pretty easy.

Adding Sections and Additional Lessons

Now that we have added a lesson (1) we want to add additional lessons and sections. We can add additional sections by using the Add Section link (2). And we can drag additional lessons from the right.

Here you can see that I created two additional sections. We are also using Ajax to insert these onto the page. Again, no big deal.

Here I renamed them so that you will be able to understand better when I reorder the sections.

Now I have added several more lessons. This is where it gets tricky. At this point I want to be able to do several things.

    1. Move a lesson from one section to another.

    2. Reorder lessons in a section.

    3. Reorder Sections.

    4. Add new lessons to a section.

Whenever a lesson is moved from one area to another two areas need to be redrawn, the place where it came from and the place where it got dropped.

That works fine pretty much like you would expect.

The Real Problem

The real problem is when you want to reorder things after dropping a lesson in a new place. This occurs in two situations:

1. Dragging a lesson onto a section.

2. Moving a lesson form one section to another.

In both cases I want to still be able to reorder the lessons in a section after I drop the lesson and I want to be able to reorder the sections.

Add and Remove the Lesson

Here is a look at the RJS template used when I add a new lesson to a section. First thing we need to do is refresh the available lessons list and then insert the new lesson into the bottom of our section. No problems there.

Make the Lessons in a Section Sortable

I want the lessons in the new section to be sortable. To do this i use page.sortable. For example if I added a new lesson to Section 1 then I call page.sortable on the "readings" (the lessons assigned to the section) in Section 1. But, as you can see form my comments that makes the sections unsortable. That is no good.

Make the Sections Sortable

So now we call page.sortable on the sections. But this causes another problem. Now the sections will no longer accept dropped items.

Allow Sections to Accept Dropped Items

Now, for each section on the page we call page.drop_receiving twice. This is to allow it to accept a lesson from a different section or a brand new lesson from the available lessons list.

Troubleshooting

This took me forever to figure out. I couldn’t figure out what was causing the sections to not be sortable. Then once I would get that fixed something else would break. Here is how I finally tracked it down.

Install Firebug

If you don’t already have Firebug then get it installed.

Activate Firebug

Open in a Separate Window

You are going to be looking at a lot of information so open it in a separate window.

Switch to DOM Tab

Select Window

Your DOM inspector is filtered by the current item selected in the top bar. The Draggables and Droppables are at the top level so click on window (1). You will then see Draggables and Droppables (2).

View Draggables

Expand the Draggables section.

View Drags

Now expand the drags. This is what you want to look at. The list to the right (1) will list the ids of everything that is draggable. As you play with your page check this area to make sure everything that is draggable remains draggable.

Refresh

Each time you perform and AJAX action on your page you will want to refresh the DOM inspector. You will notice that ids you remove from the page whit an AJAX call will not necessarily get removed from your draggable list. In my tests that didn’t seem to be a big deal. What you want to look for is when something gets removed that you didn’t want removed. In my case I started with one RJS action at a time (page.sortable, page.replace, etc.) until I could pinpoint the action that was causing me problems.

Conclusion

That’s it. You can also use to the same technique to observe the droppables. So now my solution works in Safari and Firefox. Now I just need to figure out how to get IE working.. Any suggestions would be greatly appreciated.

Subscribing to an RSS Feed in Mail (Leopard)

gregdevore — Mon, 10 Mar 2008 19:32:39 +0000

Adding an RSS feed to Mac OS X Mail

Learn how to add an RSS feed to mail. You can use this to automatically receive updates when blogs you like to read are updated.

Go to Blog

You should see the blue RSS if you are using Safari. This means that you can subscribe to this blog and have updates show up in Mac OS X mail.

Select URL

Select the full url.

Copy

Go to Mail and Select Add RSS Feeds

Select Add RSS Feeds from the File menu.

Enter URL

Select Specify a custom feed URL (1).

Paste the url into the field (2) and check Show in Inbox (3). Once you are done select Add (4).

Done

It will now show up in your Inbox. Whenever the blog is updated you see a message in your inbox.

Restoring From Time Machine

gregdevore — Mon, 28 Jan 2008 20:27:05 +0000

Last week I installed an update to Parallels. It trashed my hal.dll file on my Boot Camp drive. Unfortunately this wasn’t the first time that a Parallels update has done that. I fixed it by manually copying the file from another Windows install.

What was worse is that it somehow trashed my Leopard install. I can’t be absolutely possible that this was Parallels it happened right after updating. I couldn’t even start up.

After many attempts to recover I finally had to do a Time Machine restore. Thank goodness for Time Machine. But there was one problem. The Web Sharing wouldn’t work. I couldn’t figure out how to fix it so I finally did an archive and install. It fixed the issue but then I had to reinstall a bunch of Ruby on Rails/MySQL stuff. No fun. I wish I had read this:

http://discussions.apple.com/thread.jspa?messageID=5740794�I

Would have saved me many hours.

Note: I have used SuperDuper for a long time and thought that it was “pretty much” working with Leopard even though they haven’t officially approved it. This is not the case! I did a check of a Super Duper backup and the MySQL databases weren’t getting backed up. Luckily they were with Time Machine.

BTW: I am no longer a Parallels user. I switched to VM Ware and things are much better. Not only does it not trash my Boot Camp partition but it doesn’t bring my system to its knees when I am running Window and Leopard.