The second transition is noticeably smoother, but the neighbor colors are very similar, which makes them less distinguishable. An image that uses all possible shades will look much more beautiful, but it will contain extra information that may not be necessary. On the other hand, an image with well-spaced shades that are chosen on purpose may not reduce the perceived quality too much, while greatly reducing the file size. Each additional shade may add more information to be compressed than having the same shade used repeatedly.
Next we examine the blue shades:
We might expect to observe a similar effect here, but this isn't the case. Blue has been chosen on purpose, since it occurs as the last letter in the RGB color space, thus indicating that we are least senstive to changes in its shades (and most senstive to changes in reds). Although we can still identify some shades, the dividing line between them is much more blurry compared to the case of having gray levels. This indicates that we may be able to distinguish even less than 24 blues, especially if our monitor is exposed to bright sunlight or needs better calibration. Even when we look at the smoother case, it seems that some of the blues simply disappear.
This means that we can't choose the number of shades to be used according to a hard rule, since the decision will depend on the context.