<?xml version="1.0" encoding="UTF-8"?>
<!-- generator="wordpress/2.3.3" -->
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	>

<channel>
	<title>Vacuous Virtuoso &#187; shiira</title>
	<link>http://lipidity.com</link>
	<description>Despotic Development</description>
	<pubDate>Tue, 23 Dec 2008 06:24:04 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.3.3</generator>
	<language>en</language>
			<item>
		<title>Shiira 2 released, offers HUD framework</title>
		<link>http://lipidity.com/apple/shiira-2-released-offers-hud-framework/</link>
		<comments>http://lipidity.com/apple/shiira-2-released-offers-hud-framework/#comments</comments>
		<pubDate>Mon, 23 Apr 2007 13:43:47 +0000</pubDate>
		<dc:creator>Ankur</dc:creator>
		
		<category><![CDATA[Apple]]></category>

		<category><![CDATA[Cocoa]]></category>

		<category><![CDATA[News]]></category>

		<category><![CDATA[framework]]></category>

		<category><![CDATA[GUI]]></category>

		<category><![CDATA[Mac]]></category>

		<category><![CDATA[Review]]></category>

		<category><![CDATA[shiira]]></category>

		<category><![CDATA[Xcode]]></category>

		<guid isPermaLink="false">http://dev.lipidity.com/apple/shiira-2-released-offers-hud-framework</guid>
		<description><![CDATA[If you haven&#8217;t already heard, Shiira 2 has been released. Shiira is a web browser written in Cocoa and based on Webkit that aims to provide a better browsing alternative than Safari.

A sub-project of Shiira is a HUD-type window class. While they&#8217;re not completely accurate to the specifications used by Apple, these are probably the [...]]]></description>
			<content:encoded><![CDATA[<p>If you haven&#8217;t already heard, Shiira 2 has been released. <a href="http://shiira.jp/en.php">Shiira</a> is a web browser written in Cocoa and based on Webkit that aims to provide a better browsing alternative than Safari.</p>

<p>A sub-project of Shiira is a HUD-type window class. While they&#8217;re not completely accurate to the specifications used by Apple, these are probably the best HUD windows I&#8217;ve seen from a third party developer by a long shot.</p>

<p><a href='http://dev.lipidity.com/wp-content/uploads/2007/04/hud-window.png' title='HUD window from Shiira'><img src='http://dev.lipidity.com/wp-content/uploads/2007/04/hud-window.thumbnail.png' alt='HUD window from Shiira' height="64" width="128" /></a></p>

<p>The HUD Windows have the funny name of <a href="http://shiira.jp/hmblkappkit/en.html">HMBLBlkAppKit</a>. The Shiira team has really done a great job!</p>
]]></content:encoded>
			<wfw:commentRss>http://lipidity.com/apple/shiira-2-released-offers-hud-framework/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Lessons from Shiira</title>
		<link>http://lipidity.com/apple/lessons-from-shiira/</link>
		<comments>http://lipidity.com/apple/lessons-from-shiira/#comments</comments>
		<pubDate>Mon, 16 Oct 2006 06:28:04 +0000</pubDate>
		<dc:creator>Ankur</dc:creator>
		
		<category><![CDATA[Apple]]></category>

		<category><![CDATA[Programming]]></category>

		<category><![CDATA[Review]]></category>

		<category><![CDATA[Cocoa]]></category>

		<category><![CDATA[Mac]]></category>

		<category><![CDATA[shiira]]></category>

		<guid isPermaLink="false">http://lipidity.com/dev/uncategorized/lessons-from-shiira</guid>
		<description><![CDATA[Shiira is an open source web browser based on Web Kit and written in Cocoa. The goal of the Shiira Project is to create a browser that is better and more useful than Safari. This article presents the most useful features of Shiira and gives a preview to the some of the new additions that [...]]]></description>
			<content:encoded><![CDATA[<p>Shiira is an open source web browser based on Web Kit and written in Cocoa. The goal of the Shiira Project is to create a browser that is better and more useful than Safari. This article presents the most useful features of Shiira and gives a preview to the some of the new additions that are coming in version 2, including exclusive information from the latest build.</p>

<!--more-->

<h1>Top Shiira Features</h1>

<p>The general aim of this article is to show, from the features that have been implemented in Shiira, how you should think when brainstorming features. If your app is an exact clone of an existing one, you do yourself no favors and neither will your clients. Shiira excels in this regard. The developers have thought up and implemented some amazing features in their browser.</p>

<p>This compilation is by no means a complete list, but a general overview of the amazing features that Shiira has. A lot of the features mentioned are in Beta stages and currently being developed, so they may not be fully functional. Rating is given out of five stars for the criteria of originality, creativity, usefulness and implementation. A more comprehensive list is given on the <a href="http://shiira.jp/screenshot/en.php" rel="external" title="Shiira features">Shiira website</a>. </p>

<h2>A better browsing experience</h2>

<div style="background-color: #fcfcfc; padding: 6px; color: royalblue">
Features that present a better experience for the user, including full screen browsing and HUD Windows. A good user experience is next most important factor after functionality. If it&#8217;s not usable, who&#8217;ll use it?
</div>

<h3>Full Screen Browsing (Kiosk mode)</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 2 Beta 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
<tr><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/bug_error.png" alt="[Bug Icon]" class="icon" /> <strong>Bugs:</strong></td><td> Page dock is still visible upon activation of full screen mode, but it doesn&#8217;t update. (Expected to be fixed before the final release)</td></tr></table>

<h4>Ramblings</h4>

<p><a class="imagelink" href="http://lipidity.com/dev/wp-content/uploads/2006/09/kiosk.png" title="Shiira Kiosk Mode Screenshot [New Window]" target="_blank" rel="lightbox"><img id="image15" src="http://lipidity.com/dev/wp-content/uploads/2006/09/kiosk-bar.png" alt="Shiira Kiosk Mode" /></a></p>

<p>Shiira 2 boasts a full screen browsing mode, which is something Mac applications generally tends to lack. Kiosk mode includes a black semi-transparent draggable controller similar to the iPhoto slideshow controller. Browsing full screen obviously feels more spacious as you can&#8217;t see the clutter on your desktop. A great feature well implemented.</p>

<h3>Page Transitions</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
<tr><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/bug_error.png" alt="[Bug Icon]" class="icon" /> <strong>Bugs:</strong></td><td> Not really a bug, but the transitions are a little fast and zappy, and not as smooth as is expected on OS X. </td></tr>
</table>

<h4>Ramblings</h4>

<p>Most people find page transitions annoying, but it is still a viable feature. For this to work, give us options. Use CoreImage transitions like the ripple, cube, flip, or flash effects, but also simple cross dissolves and more subtle transitions.</p>

<h2>Web browsing simplified</h2>

<div style="background-color: #fcfcfc; padding: 6px; color: royalblue">
Again, it&#8217;s all about usability. One of the main reasons Mac runs rings around Windows is that it&#8217;s got power, but it&#8217;s so simple! Always assume ignorance from your users and write your app accordingly. There&#8217;s not need to ask for encoding type, ASCII or binary, language and compression if all the user wants to do is save the darn file. Keep it simple.
</div>

<h3>Tab Exposé</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr></table>

<h4>Ramblings</h4>

<p><a class="imagelink" href="http://lipidity.com/dev/wp-content/uploads/2006/10/tabpose-copy.png" title="Shiira Tabpose" rel="lightbox"><img id="image38" src="http://lipidity.com/dev/wp-content/uploads/2006/10/tabpose-copy.thumbnail.png" alt="Shiira Tabposé" /></a></p>

<p>If you aren&#8217;t convinced by the other features to try out Shiira, this is the clincher. Tab exposé is a Shiira only feature; you wont find it anywhere else. It&#8217;s fast, efficient and completely useful. If you rely heavily on tabbed browsing, your method of navigation from one tab to the next is probably hitting the next tab shortcut a couple of dozen times. Not any more. A simple F8 shows thumbnails of all open tabs. The page URL and title are shown if you hover your mouse over one of the thumbnails, and the point-and-click functionality fits right into the Mac. It just works.</p>

<h3>Shelf</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 2 Beta 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
</table>

<h4>Ramblings</h4>

<p><a class="imagelink" rel="lightbox[Shelf]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/new-shelf.png" title="Shiira Shelf"><img id="image24" src="http://lipidity.com/dev/wp-content/uploads/2006/10/new-shelf.thumbnail.png" alt="Shiira Shelf" /></a></p>

<p>One of the greatest, if not the greatest features of Shiira is the Shelf. The sidebar from version 1 has been completely removed, with the Shelf providing access to almost everything. RSS hasn&#8217;t been ruled out, bookmarks, history and downloads are all there (A cool feature of downloads is the ability to open the referrer URL. Great if you forgot where you got it from).<br /><br />The <strong>Address Book</strong> debuts in version 2. At this stage it&#8217;s semi-functional; you see all your contacts, but there&#8217;s nothing you can do with them yet. Perhaps an &#8220;email this person&#8221; feature is in the works?<br />Another interesting find in the new Shelf was a <strong>Bonjour</strong> category. It shows a big &#8220;Not implemented&#8221;, but I&#8217;m curious as to what could be coming.<br /><br />Finally, there are the Safari and Firefox bookmarks (Shiira can sync history +bookmarks across all three browsers), and a configurable list of search engines ends the Shelf. A nice new array of features is brewing&#8230;
</p>

<h3>Print Page as PDF</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
</table>

<h4>Ramblings</h4>

<p><a class="imagelink" rel="lightbox[PDF]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/pdf-dialog.png" title="Save As PDF Dialog"><img id="image36" src="http://lipidity.com/dev/wp-content/uploads/2006/10/pdf-dialog.thumbnail.png" alt="PDF Dialog" /></a><a class="imagelink" rel="lightbox[PDF]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/pdf-page.png" title="Shiira PDF"><img id="image37" src="http://lipidity.com/dev/wp-content/uploads/2006/10/pdf-page.thumbnail.png" alt="Shiira PDF" /></a></p>

<p>The greatest feature since bookmarks, saving a page as a PDF has obvious advantages. Not only does it guarantee you a copy of the webpage when you&#8217;re offline, it also means you&#8217;re insured against changes on the page, domain name expiries or server downtimes. The further benefit of the PDF format is that it&#8217;s all in one piece! Never worry about Webpage142_files again.
</p>

<h3>Email Page Contents</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
</table>

<h4>Ramblings</h4>

<p><a class="imagelink" rel="lightbox[Email]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/email-page.png" title="Email Page Contents"><img id="image39" src="http://lipidity.com/dev/wp-content/uploads/2006/10/email-page.thumbnail.png" alt="Email Page Contents" /></a></p>

<p>Yes, they have the standard &#8220;email page location&#8221; feature, but as Apple take things to the extreme, so do these Japanese Shiira developers. This is something I&#8217;ll definitely be making use of. Email page contents lets you send the <em>entire page</em> to someone. Not only does this reduce the effort of your recipient having to click a link to get to it, the process is completely automated (I&#8217;d even say fully automated). Shiira pops the HTML out into Mail, where you can add a recipient and send the whole page away. Support for other mail programs may be requested, but for a Mac-only browser Apple Mail seems adequate.</p>

<h2>A Developers&#8217; Dream</h2>

<div style="background-color: #fcfcfc; padding: 6px; color: royalblue">
You&#8217;ve got a great app, but what if someone wants to add functionality to suit their needs? Or tweak it to optimize it for their system? Or add a plugin? One of the main things developers need to do when writing apps is to provide an API for external developers to build on your work. Shiira does this, but being a web browser, it can afford to go a little further and make the web developers (including me) happy as well. 
</div>

<h3>Page Info</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
</table>

<h4>Ramblings</h4>

<p><a class="imagelink" rel="lightbox[ShiiraSource]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/source-general.png" title="Source General Info"><img id="image33" src="http://lipidity.com/dev/wp-content/uploads/2006/10/source-general.thumbnail.png" alt="Source General" /></a><a class="imagelink" rel="lightbox[ShiiraSource]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/source.png" title="Shiira View JavaScript Source"><img id="image23" src="http://lipidity.com/dev/wp-content/uploads/2006/10/source.thumbnail.png" alt="Shiira View Source" /></a><a class="imagelink" rel="lightbox[ShiiraSource]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/source-links.png" title="View Outgoing Links"><img id="image34" src="http://lipidity.com/dev/wp-content/uploads/2006/10/source-links.thumbnail.png" alt="Source Links" /></a><a class="imagelink" rel="lightbox[ShiiraSource]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/source-images.png" title="View Images"><img id="image35" src="http://lipidity.com/dev/wp-content/uploads/2006/10/source-images.thumbnail.png" alt="Source Images" /></a></p>

<p>What could be different about viewing the HTML source? Amazingly, the developers have managed to make it easier for web designers in examining a page&#8217;s content by replacing the standard view source with view <em>Page Info</em>. Normally, to view the contents of linked stylesheets, I copy and paste the location into a new tab. Not anymore. Shiira provides all the linked and hard-coded elements right in the one window, from javascript, to CSS, to images. This goes one step further than Firefox, where it gives just the locations of linked stylesheets and .js files. Never open more than window for viewing page info again.</p>

<h3>Fantastic Preferences Window</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 2</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
</table>

<h4>Ramblings</h4>

<p><a class="imagelink" rel="lightbox[Prefs]" href="http://lipidity.com/dev/wp-content/uploads/2006/10/prefs.png" title="Preference Panes"><img id="image40" src="http://lipidity.com/dev/wp-content/uploads/2006/10/prefs.thumbnail.png" alt="Preference Panes" /></a></p>

<p>This is one of those things that I&#8217;m going to look at straight away when the Shiira guys release the source (Along with the <a href="#HUD" title="HUD Windows">HUD Windows</a>).
A working clone of System Preferences. Yes, the UI could be tweaked a little bit, but the code is all there. Again, an implementation of application preferences that has been attempted many times, but this is the first time I&#8217;ve personally seen it actually <em>work</em>.</p>

<p><a name="HUD"></a></p>

<h3>HUD Done Right</h3>

<h4>At a glance</h4>

<table><tr><td><strong>Availability: </strong></td><td>Shiira 2 Beta 1</td></tr>
<tr><td><strong>Rating:</strong></td><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/star.png" alt="*" class="icon" /></td></tr>
<tr><td><img src="http://lipidity.com/dev/wp-content/themes/durable/images/icons/bug_error.png" alt="[Bug Icon]" class="icon" /> <strong>Bugs:</strong></td><td> Weird things happen when the drop down options box is clicked. (Expected to be fixed by final release)</td></tr></table>

<h4>Ramblings</h4>

<p><a class="imagelink" href="http://lipidity.com/dev/wp-content/uploads/2006/10/hud-window.png" title="Shiira HUD Downloads Window" rel="lightbox[ShiiraHUD]"><img id="image18" src="http://lipidity.com/dev/wp-content/uploads/2006/10/hud-window.thumbnail.png" alt="Shiira HUD Panel" /></a><a class="imagelink" href="http://lipidity.com/dev/wp-content/uploads/2006/10/picture-2.png" title="Shiira HUD Panels" rel="lightbox[ShiiraHUD]"><img id="image20" src="http://lipidity.com/dev/wp-content/uploads/2006/10/picture-2.thumbnail.png" alt="Shiira HUD Panel" /></a><a class="imagelink" href="http://lipidity.com/dev/wp-content/uploads/2006/10/hud-history.png" title="Shiira HUD History" rel="lightbox[ShiiraHUD]"><img id="image21" src="http://lipidity.com/dev/wp-content/uploads/2006/10/hud-history.thumbnail.png" alt="Shiira HUD History" /></a></p>

<p>The number of people who have attempted HUD windows in Cocoa and failed is astonishing. I&#8217;m grabbing the source for this as soon as it hits the shelves. <em>Finally</em>, an implementation that is resizable and has custom scrollbars without being web-based. Might not be hard, but it&#8217;s good to see attention to detail. The windows aren&#8217;t finished yet in terms of functionality, but they&#8217;re inspiring nonetheless. Perhaps varying levels of transparency would be something to consider for the release version.</p>
]]></content:encoded>
			<wfw:commentRss>http://lipidity.com/apple/lessons-from-shiira/feed/</wfw:commentRss>
		</item>
	</channel>
</rss>
