the architecture of future websites by luristic

24
The Architecture of Future Websites White Paper 04-15-2010 Dr. David Saad - Chairman & CEO [email protected]

Upload: luristic

Post on 19-May-2015

1.036 views

Category:

Technology


0 download

DESCRIPTION

The World Wide Web started as a communication tool in the 80’s. By early 90’s, with the advent of the browser, the web became a publishing platform consisting of websites which were nothing more than online brochures. By the end of the 20th century in the late 90’s, the web morphed into a transaction platform in which some websites became online stores. More than just communicating and publishing, web users were transacting at that time, which marked the beginning of the monetization of the web.

TRANSCRIPT

Page 1: The Architecture Of Future Websites by Luristic

The Architecture of Future Websites

White Paper

04-15-2010

Dr. David Saad - Chairman & CEO

[email protected]

Page 2: The Architecture Of Future Websites by Luristic

Table of Content

1. Summary ………………………………………………………………………………………………… 3

2. Information Architecture ……………………………………………………………………………….. 4

3. Functional Architecture ………………………………………………………………….……………… 5

3.1. Top Toolbar ……………………………………………………………………………… 6

3.2. Bottom Toolbar ………………………………………………………………………….. 7

3.3. Toolbar Features ………………………………………………………………………... 8

4. Navigation Architecture ……………………………………………….………………………………… 9

5. Interface Architecture ………………………………………………..…………………………………... 18

6. System Architecture ……………………………………………………………………………………… 19

7. Conclusion ………………………………………………………………………………………………… 20

8. Biographies ……………………………………………………………………………………………….. 21

8.1. Author’s Biography: Dr. David Saad …………………………………………………. 21

8.2. Company’s Biography: Luristic ……………………………………………………….. 22

9. References ………………………………………………………………………………………………… 23

2

Page 3: The Architecture Of Future Websites by Luristic

1. Summary The World Wide Web started as a communication tool in the 80’s. By early 90’s, with the advent of the browser, the web became a publishing platform consisting of websites which were nothing more than online brochures. By the end of the 20th century in the late 90’s, the web morphed into a transaction platform in which some websites became online stores. More than just communicating and publishing, web users were transacting at that time, which marked the beginning of the monetization of the web. Nowadays, a decade later, the web became an application platform supporting all types of applications from enterprise applications to games. This evolution led to the rise of Software-as-a-Service (SaaS) under the Application Service Provider (ASP) model. However, despite this rapid growth of the usage of the web both in volume and diversity of usage, user experience of websites and web applications suffered first due to lack of broadband, and second by the limitations of the browser and HTML. With the advent of new tools such as HTML 5 and the adoption of new Rich Interactive Application (RIA) frameworks such as Adobe Flex and Microsoft Silverlight, it is time to revamp the web. This white paper proposes to strengthen the architecture of future websites by adopting five fundamental architectures, namely:

Information Architecture that supports a collage of content coming from different sources in a collaborative and corroborative manner, a truly multimedia content, and a flexible taxonomy. While Search Engine Optimization (SEO) is critical for achieving visibility on the web, crawlability, searchability, and indexation should not compromise usability. In other words, finding something that turns out to be not so usable is actually useless.

Functional Architecture that supports at least the most common functions including security (register and login), discovery (search and browse), social (share, refer, rate, review, note, tag, bookmark, favorite, and embed), commerce (order, pay, reserve, and track), Communications (e-mail, telephone, chat, post, and blog), contacts (rolodex, locations, maps, and directions), assistance (help, tutor, and wizard), and personalization (settings). Functions should be grouped together based on common criteria or properties and should be placed in toolbars similar to desktop applications.

Navigation Architecture that supports a comprehensive website map that can be accessed using

different views such as accordion, drop-down-menus, tree, or thumbnails. Such navigation system must be able to handle different types of hierarchical structures of websites – from the very flat to the very deep ones. Similarly, lists are better accessed using parent-child windows which increase productivity and usability. Furthermore, the usage of Rich Interactive Components (RIC) such as the accordion, carousel, docks, wheels, and walls are all necessary to offer an intuitive and pleasant navigation experience.

Interface Architecture that supports Graphical User Interfaces (GUI) which are highly attractive,

interactive, collaborative, immersive, and engaging. Such Gus offer a very rich user experience that satisfies the values of the brand of the publisher of the website.

System Architecture that offers industrial robustness by providing scalability, reusability, flexibility,

manageability, maintainability, multi-threading, load balancing, fault-tolerance, recovery, security, internationalization, etc.

3

Page 4: The Architecture Of Future Websites by Luristic

2. Information Architecture 2.1. Content Despite the proliferation of User Generated Content (UGC) such as blogs, comments, notes, annotations, recommendations, ratings, reviews, and the like, the great majority of websites are currently limited to content published by their publishers or owners. Future websites will become collages of content coming from different sources including publishers, visitors, users, and contributors like pundits or bloggers. Such collaboration and corroboration make the published content more comprehensive, convincing, connected, and viral causing websites to become hubs which increases their searchability, accessibility, meritocracy, and ultimately, their visibility in the websphere. Vice versa, the absence of such independent validation of the content will lead websites to their mediocrity, and eventually, to their demise. 2.2. Format Despite the advent of videos on the web, textual content dominates the websphere. Whenever videos are used, their content complements the textual content of a website. For instance, a webpage that includes a text description and some pictures of a product, may also include a video of the product being used. In this case, the text content which describes the product is different than the video which highlights the usage of the product. With the quick and wide adoption of videos along with the availability and the affordability of broadband, future websites will become true multimedia platforms by expanding the applicability of videos to infomercials, in which case, the same textual information is also conveyed in audio or video. Hence, users will be totally empowered by being able to not just choose the information that they wish to get, but also choose the format that they prefer. In essence, websites will become a combination of publication and television with the advantage of being connected, on-demand, searchable, traceable, customizable, reviewable, and referable. 2.3. Taxonomy The classification and organization of information have critical impact on usability. At the extremes, deep hierarchical taxonomies are simple but slow to navigate through, while flat taxonomies are fast to access but they are cluttered and messy. The information architecture of most websites is based on the publisher’s view of the world and not necessarily their constituents’. Sure enough, the classical taxonomy of websites is currently defined by products, services, specialties, etc. Another approach is to organize the content based on personas (type of visitors) or functions (type of transactions). In addition of providing multiple predefined taxonomies from which users can chose from, the ultimate websites of the future will allow frequent users to define their own taxonomy based on their preferences. By recognizing visitors and presenting to them the content organized in the way they prefer, publishers can bond with their users and turn them into loyal evangelists. 2.4. Frequency The frequency by which content is refreshed determines the retention rate of regular visitors. Publishers will have difficulty in maintaining such instant and continuous gratification. That is another reason why it is necessary for publishers to encourage collaboration and corroboration in order to satisfy a huge appetite for information collection and knowledge consumption.

4

Page 5: The Architecture Of Future Websites by Luristic

3. Functional Architecture Most websites are still nothing more than online brochures. In the future, websites will become web applications that include the following basic and common functions:

Security: o Register o Login / Logoff

Discover

o Search o Browse

Social

o Share o Refer o Rate o Review o Note o Tag o Bookmark o Favorite o Embed

Every function has a set of features and a set of actions. For example, the reviewing function includes features such as rich text formatting, polling, filtering, browsing through reviews using a carousel, etc. Examples of actions in a function would be saving, submitting, cancelling, clearing, resetting, adding, deleting, etc. Furthermore, there are certain authoring actions that are related to objects which could be a block of text, graphics, illustrations, pictures, etc. Examples of authoring actions are cutting, copying, pasting, dragging, dropping, sizing, expanding, collapsing, flipping, panning, rotating, zooming, and highlighting. Considering the number of functions, their features, and their actions, it is easy to see how things can get very complicated resulting into messy, disorganized, unfriendly, and unusable websites. The fundamental principle is to abolish the practice of designing websites based on a page-centric approach introduced by artists and technicians that resulted in chaotic mazes. Instead, we should borrow some discipline and best-practices found in desktop and enterprise applications developed by trained software engineers. Functional architecture attempts to take a holistic approach that covers the entire website rather than being bogged down by the needs of a particular webpage. A good functional architecture starts by asking what functions are needed, how to group them together based on common properties, where to place them, and how to invoke them. Desktop and enterprise applications have certain minimum industry standards, some best-practices, and certain software engineering disciplines that required a holistic architecture. This led to the creation of toolbars which offered consistency throughout a particular application, and throughout different applications. For example, the “Save” button in Microsoft Word stays in the same exact location throughout the entire product. Furthermore, the “Save” button, in almost all desktop or enterprise applications, is placed in the same spot. Such consistency increases usability within an application and across applications. Websites on the other hand have been often created by artists who became technicians who fall short of being disciplined engineers. This led to the creation of websites which are page centric instead of being holistic. Those technicians have been designing websites one page at a time. Buttons appear anywhere. Inconsistency is everywhere – within a website and across websites. The lack of discipline in the entire websphere is mind-boggling. Mind you, other industries such as the auto industry or the electronics industry have adopted certain standards. Similarly, software in general, and the web in particular, should be subject to universal standards for the purpose of increasing usability and enhancing user experience.

5

Commerce: o Order o Pay o Reserve o Track

Communications:

o E-mail o Telephone o Chat o Post o Blog

Contacts

o Rolodex o Locations o Maps o Directions

Assistance: o Help o Tutor o Wizard

Personalization:

o Settings

Page 6: The Architecture Of Future Websites by Luristic

3.1. Top Toolbar A website typically has some frequently used functions which are independent of the content of the current webpage. Examples of independent functions are registering, logging, searching, setting, etc. Thus, those independent functions are applicable across all webpages of a website. Such independence bonds those types of functions together in a group placed in the same location throughout the entire website – in a top toolbar. Hence, the main purpose of a top toolbar is to easily, instantly, and consistently access independent functions. In addition, a top toolbar may also include helpful shortcuts related to certain functions or webpages that the owners of a website would like to encourage or promote to their visitors. Examples would be sending a message, chatting with a customer support representative, calling a sales representative, review the cart, etc. Independent functions are primary, while shortcuts are secondary. As a result, their respective visual appearance should reflect their importance status. Finally, a top toolbar may include a logo of the company which reinforces the brand as shown in the example below. The logo should be a hyperlink to the webpage that describes the company. Due to their independence from the current webpage, independent functions should be presented in pop-up windows as shown below. For instance, while reading a webpage, a visitor may decide to register. The action of registering should not cause the loss of the current webpage. Reading the webpage is indeed the main action, while registering is a temporary interruption because once the registration is completed, the natural course of event is to continue reading the current webpage. Same principle applies to other functions such as logging, searching, and setting. While many advocate against any pop-up, this is a good example where pop-ups are not just necessary but desirable in order to increase usability and enhance user experience.

6

A pop-up window is appropriate for functions such as registering, logging, searching, and setting because once the function is completed, the current webpage would be readily available without having to click on the back button.

Page 7: The Architecture Of Future Websites by Luristic

3.2. Bottom Toolbar A webpage could include either a dynamic content such as a record in a database or static content such as the description of a product shown in text, graphics, illustrations, pictures, audios, or videos. After completing a form of a dynamic webpage, a user might want to execute functions that are related to dynamic content such as saving, submitting, clearing, resetting, cancelling, adding, or deleting. Similarly, after reading a static webpage, a visitor might want to execute functions that are related to static content such as referring, sharing, tagging, reviewing, noting, or bookmarking the webpage. Thus, it makes sense for such functions to be grouped together and placed in a bottom toolbar below the dynamic or static content. The bottom toolbar must be intelligent enough to present the appropriate functions that correspond to the type of content. Thus, the bottom toolbar must be multi-functional and context-driven.

7

In case of a dynamic content, the bottom toolbar includes functions such as Clear, Submit, and Cancel.

In case of static content, the bottom toolbar includes functions such as Refer, Share, Tag, Review, Note, Bookmark, and Favorite.

Page 8: The Architecture Of Future Websites by Luristic

3.3. Toolbar Features Combining some of the best practices found in all worlds (i.e., desktops, mobile devices, appliances, games, and the web), a toolbar should include some of the following common main features:

Draggable.

Sizeable.

Visual distinction of primary versus secondary functions.

Special effects on buttons for all states including enabled, disabled, hovered, clicked, and selected.

Selection of the functions to be included and those to be excluded in the toolbar.

Selection of the order in which functions ought to appear in the toolbar.

Multi-functional and context-driven whenever applicable.

Remembrance through cookies and/or login of the display mode, location, size, selection of functions, order of functions, etc.

Visibility: anchored (displayed at all times), or hidden (displayed upon hovering).

Accessibility: whether anchored or hidden, a toolbar should be instantly accessible without scrolling

regardless of the size or the resolution of the screen. The screenshot below shows how the scrolling occurs in between the top and bottom toolbars which are visible and accessible at all times, and thus enhancing usability. If a user chooses to hide the toolbars, then the top and bottom areas of the screen will be “hot” areas. Upon hovering over a hot area, the corresponding toolbar appears without having to scroll, in which case, the toolbar is instantly accessible even though it is not visible because the user chose to hide it.

8

If scrolling is required, it occurs in between the top and bottom toolbars making them always visible, and if not visible because the user chose to hide them, then they will be accessible by simply hovering over their respective hot area at the top or the bottom.

Page 9: The Architecture Of Future Websites by Luristic

4. Navigation Architecture If there is any one particular aspect that impacts usability the most, it would be navigation, especially in websites. Because of their poor navigation, websites tend to be mazes in which we have all been lost in, and found ourselves asking: where am I? How did I get here? Where do I go from here? Where is the page that I just looked at? A website consists of a collection of webpages organized in a hierarchical structure where the main sections are at the highest level. Within every section, there could be number of sub-sections, and within every sub-section, there could be number of sub-sub-sections, until a node or a leaf is reached which would be the final destination webpage. In essence, the structure of a website is exactly the same as the structure of the folders in our computer which is typically accessed using a tree component like Windows Explorer. The view of the list of folders could be a tree, thumbnails, carousel, wheel, wall, or a directory. Some views are better suited than others for a particular content. For example, a carousel would be ideal for a small list of pictures but terrible for a large list of job descriptions for which a directory would be far more suitable. Furthermore, different users prefer different views. For example, novice consumers prefer a thumbnail view while advanced technical users tend to prefer a tree view. The great majority of websites use horizontal tabs as their main navigation paradigm, yet, while tabs are suitable for flat structures, they are quite inappropriate for hierarchical structures. In order to compensate, web designers combine tabs with horizontal or vertical menu bars as shown below. This combination falls flat on its face when the hierarchical structure has more than two levels. Home Company Products Services Contact Us History Mission Vision Management Careers Investors

Home Company Products Services Contact Us

History

Mission

Vision

Management

Careers

Investors

9

Page 10: The Architecture Of Future Websites by Luristic

Another common combination is the usage of tabs with drop-down-menus.

Home Company Products Services Contact Us

History

Mission

Vision

Management

Careers Jobs Investors Benefits Vacation

Interviews Insurance Education Even though cascading drop-down-menus are an adequate representation of a hierarchical structure, they are awkward to navigate, especially if navigation occurs often, because by their very nature, drop down menus are not designed to stay visible. Thus, users found themselves hovering over the same path over and over again to get where they need to go, unlike a tree where the structure is displayed at all times allowing a user to go directly to the desired node in the tree without having to expand and collapse each and every level in the desired path. For example, if a user selects “Vacation” from the third level in the path “Company-Careers-Benefits-Vacation”, and then wishes to view “Insurance”, then the user will have to travel all over again through the same path “Company-Careers-Benefits” to get to “Insurance” because those drop-down-menus disappear when the user selected “Vacation” the first time around. Furthermore, drop-down-menus in a browser are notorious for annoying users because they are often hard to catch - all it takes is a tiny bit of jerking the focus of the mouse away from the drop down menu for all the drop-down-menus to disappear, and the user would have to start all over again. As sown below, the ideal navigation system that websites ought to have should combine number of different paradigms and views including tree, accordion, thumbnails, drop-down-menus, wall, and wheels. In addition, an ideal navigation system should take advantage of the web, its connectivity, and its capability of collecting the wisdom of crowds for the purpose of providing suggestions and shortcuts such as:

Most popular webpages in a website based on number of unique visitors and number of visits.

Highest rated webpages in a website.

Webpages similar to or complementary to the current webpage recommended by the publisher or owner of the website. For example, if a user is viewing a description of a product, the publisher could recommend to also visiting the demonstration, presentation, articles, brochures, and white papers related to the product. Thus, the user will instantly have access to everything available about the product in one concise place.

List of webpages bookmarked by a user. If a user has the habit of accessing some specific pages, gathering those specific pages in one place can save the user a lot of navigation.

List of links created by a user within a specific page. For example, if a page is quite long, a user can simply highlight the paragraph titles and create links for a quick and easy access to certain parts of the webpage.

History of webpages visited listed in reverse chronological order starting with the most recently visited.

10

Page 11: The Architecture Of Future Websites by Luristic

11

Accordion

Thumbnails Bookmarks Recommended webpages Drop Down Menus Tree Popular webpages

History

Links within current webpage

Services | Training | Description

Go Button

A breadcrumb shows the path of the currently selected webpage clearing any ambiguity as to how the user got to the current webpage.

The breadcrumb offers an alternative navigation paradigm by allowing a user to click on any particular entry in the breadcrumb or type a particular path and then click on the “Go” button or the “Enter” key on the keyboard.

StatisticSettings Current Level Up One LevelTop Level Collapse All Expand All

Page 12: The Architecture Of Future Websites by Luristic

Accordion

12

Page 13: The Architecture Of Future Websites by Luristic

Drop-Down-Menus

13

Page 14: The Architecture Of Future Websites by Luristic

Tree

14

Page 15: The Architecture Of Future Websites by Luristic

Thumbnails

15

Page 16: The Architecture Of Future Websites by Luristic

In case of flat hierarchies, or in case of functions to be executed, the usage of a bar or a dock with a wave or Genie effect similar to the Mac Dock would be very appropriate. In such event, websites will start behaving like desktop applications, and vice versa, combining the best practices of both worlds.

A thumbnail appears upon hovering over an icon in the dock similar to what currently Windows 7 offers in its “Status Bar”. Such feature offer users the capability of visually browsing a website, which is a very effective way of navigating without ever resorting to any click or any refreshing of a webpage.

A bar or a dock with a wave or a Genie effect when

hovering over icons offers a very pleasant user experience that users are familiar with on their desktops such as the Mac Dock. No reason why such rich user experience should not be made available on the web.

16

Page 17: The Architecture Of Future Websites by Luristic

Another scenario is navigating a list of items which could be documents, webpages, pictures, products, etc. Conventionally, web designers have used a page-centric approach to managing and accessing lists in which the list of items is presented in one page, and the details of each item are presented in another page that replaces the page that includes the list. So once a user clicks on an item on the list, that page is refreshed and is replaced by a page showing the details of the selected item. If the user needs to see the list again, he/she must click on the back button. In the event that a user is in discovery mode, this paradigm could become quickly quite annoying because the user will have to go back-and-forth between the page that shows the list and the page that shows the details of an item until the desired item is found. By using parent-child windows in an asynchronous manner that does not require refreshing the entire webpage every time an item is selected, navigating through a list of items becomes not just effective but very pleasant.

Parent window that includes a list which could be displayed in different views such as carousel, thumbnails, wheel, wall, and directory or table whose columns could be sized, ordered, and sorted like in a spreadsheet providing desktop features on the web. The parent window itself can be sized, collapsed, expanded within the current webpage, or expanded in a new tab in the browser.

Child window, which is showing the details of the selected item in the list, can include another webpage, a PDF file, a media player, tabs, etc. When a new item is selected from the list, only the child window is refreshed and not the entire webpage. The child window itself can be sized, collapsed, expanded within the current webpage, or expanded in a new tab in the browser.

17

Page 18: The Architecture Of Future Websites by Luristic

5. Interface Architecture A Graphical User Interface (GUI) defines usability, which in turn, determines user experience. A GUI consists of the following parameters:

Layout, which defines the location on a webpage where objects such as toolbars, forms, widgets, text, media players, buttons, sliders, and the like are placed.

Aesthetics, which define the shape, style, colors, gradients, and textures of objects. Typically, it is highly desirable that the aesthetics match the properties of the company’s brand.

Interactions, which define the colors, textures, gradients, sounds, animations, and special effects for:

o States including enabled, disabled, hovered, clicked, selected, or visited state. For example, an enabled button should be embossed to invite a user to click on it, while a disabled button should be engraved with fading colors to indicate its disabled status.

o Shapes including icons representing the different states of the cursor. For example, a cursor could be normally represented by an arrow which is transformed into a hand upon hovering over a hypertext or a hyperlink to indicate to a user that the text or the object is a link. Different shapes should be used for sizing, dragging, panning, etc.

o Actions including cut, copy, paste, drag, drop, size, collapse, expand, rotate, flip, slide, pan, scroll,

etc. More than just looks, aesthetics, and beauty, the architecture of the different elements of a GUI must have an underlying function beyond their façade. In other words, the elements of a GUI must have a meaningful behavior that makes their usage more intuitive. For instance, when dragging an object, it is necessary to display the shadow of the object to indicate to the user that the object is actually being dragged and to enable the user to drop the object at the desired location. Playing a sound when expanding a window and another sound when collapsing it could enhance the user experience. When users become so accustomed to all such sounds, animation, and special effects, they unconsciously rely on those special effects to conclude whether or not their action was successfully executed. Thus, those special effects become an integral part of the GUI.

Hovered with a multimedia tooltip that offers a text and audio explanation which could be turned on or off.

Enabled with an embossed effect. Selected with an engraved effect.

In order to show that a button is disabled, aesthetically the button is shown as engraved and faded with the background, and interactively, the cursor would remain an arrow and would not turn into a hand as it is done with enabled buttons.

Clicked with an engraved effect.

18

Page 19: The Architecture Of Future Websites by Luristic

6. System Architecture Since websites have been increasingly morphing into web applications, their system architecture takes center stage. Websites can no longer be considered as a set of interconnected webpages that can be managed by a document management system. Like any application that requires a minimum level of industrial robustness, websites require a three-tier architecture that includes:

A presentation tier that covers the graphical user interface with all its aesthetics and interactions. It allows users to retrieve and enter data.

An object tier that covers all the algorithms related to business rules, data validation, work flow, etc. The modules of this second tier reside on a server machine, to assist in resource sharing.

A data tier that includes all the static and dynamic content.

This three-tier architecture offers scalability, reusability, flexibility, manageability, maintainability, multi-threading, load balancing, fault-tolerance, recovery, security, internationalization, etc. Code, components, modules, and web services can be created, distributed, and used across the network as required.

19

Page 20: The Architecture Of Future Websites by Luristic

7. Conclusion Users’ expectations are on the rise. The web is aging and it needs to be revamped. Now that there are several platforms that users resort to for different needs, with each platform having its own best-offerings, there is a need to converge such best-offerings of each platform in all other platforms whenever applicable to create an ideal and best-of-all-words. For example, there is no reason today why Rich Interactive Components (RIC) such as accordion, carousel, wheel, wall, dock, parent-child panels, configurators, mixers, selectors, and the like, which have been historically available on the desktop, should not also be available on the web. Websites are morphing into full-fledged web applications of all types from enterprise applications to games. Such transformation requires a more thorough and disciplined approach to architecting websites beyond being online stores, or worse, online brochures. So far, web design has been page-centric suffering from the limitations of the browser and HTML. The websites of the future will be based on RIA platforms. They will have a broad architecture that covers content, functions, navigation, user interface, and system requirements to provide a minimum industrial robustness along with high usability and very rich user experience.

20

Page 21: The Architecture Of Future Websites by Luristic

8. Biographies Author’s Biography: Dr. David Saad Dr. David Saad is the founder, Chairman & CEO of Luristic. He is responsible for the overall direction and management of the company. He is a seasoned veteran in the software industry with over 27 years of experience in sales, marketing, engineering, and funding making him uniquely positioned to lead Luristic. Dr. Saad started his career as a system programmer, became a data base consultant, a public speaker, an entrepreneur, and an angel investor. Prior to Luristic, Dr. Saad was the founder, Chairman & CEO of Clupedia - a social media company that offered clues from crowds. Clupedia was the Wikipedia of opinions. The company won several industry awards for its innovation including the AlwaysOn Media 100 award. During his tenure with Clupedia, Dr. Saad won the Most Promising Investment Award during the 2006 Fast Pitch competition sponsored by Tech Coast Angels (TCA) from whom he raised a Series A round of funding. Prior to Clupedia, Dr. Saad was the founder, Chairman & CEO of Calibra - a software company that offered a viral marketing tool that used Social Network Analysis (SNA) in order to identify influencers within a social network for the purpose of launching, managing, and measuring viral campaigns. Calibra was nominated for the Innovative Product of the Year Award by the American Electronics Association (AeA). Prior to Calibra, Dr. Saad was the founder, Chairman & CEO of Braintec - a software company specialized in Unix kernel development, compilers, computational linguistics, and artificial intelligence. Braintec became the largest Unix engineering firm in Southern California with customers such as AT&T, IBM, Sun, NCR, and Teradata. Braintec was sold to Technisource – an IT firm listed on NASDAQ which was taken private by IntelliMark Holdings. During his tenure with Braintec, Dr. Saad was also the founder, Chairman & CEO of In-D-Pocket - a label company specialized in R&B, Hip Hop, and rap music. One of the company’s acts was a female group called Foxx Empire whose debut album included couple of hits such as “Do You Want Me”, “Can’t Let Go”, and a remix of “Walkin’ in Rhythm”. Prior to Braintec, Dr. Saad worked for Mathematica Products Group (MPG) – a software division of Martin Marietta where he was instrumental in establishing the Canadian division. During his stint at MPG, Dr. Saad won several awards for his software sales achievements including the ICP award. Prior to Mathematica, Dr. Saad worked as a programmer and data base consultant for IST - a consulting and service bureau based in Montreal, Canada. Dr. Saad earned a PhD in Computer Science with high honors from University of Paris, an M.Sc.A. Cum Laude in Computer Science from McGill University, a B.Sc. in Computer Science from Concordia University, and a D.E.U.G. in Mathematics & Economics from University of Paris. He speaks four languages. He had a very successful athletic career in Judo during which he participated in the European Championships, World Championships, Pan American Games, and the Olympic games. Dr. Saad is a USTA member and regularly participates in league and national tennis championships.

21

Page 22: The Architecture Of Future Websites by Luristic

Company’s Biography: Luristic Luristic is a new breed of firm that combines the technical skills of an innovative software company along with the creativity of an avant-garde agency. Luristic is specialized in Rich User Experience (RUE) for websites, web applications, desktop applications, mobile applications, embedded applications, and games. Luristic is a leader and a pioneer in RUE – a very exciting yet quite complex multi-disciplinary field which combines function & form, substance & style, and art & science. It requires the precision of a software engineer, the analytics of a computer scientist, the heuristics of a cognitive behaviorist, and the creativity of an artist. Luristic takes a holistic approach by offering a comprehensive set of products and services that deliver world-class, award-winning, and state-of-the-art applications and websites with very rich user experiences that lure, attract, engage, interact, convert, and retain users with extensive features, robust architecture, logical taxonomy, flexible workflow, intuitive navigation, and stunning graphical user interface. Luristic’s products complement the two most popular Rich Interactive Applications (RIA) platforms, namely Adobe Flex and Microsoft Silverlight. The products are highly customizable with a very flexible skin which can match the branding of a company. Those products consist of an integrated suite called Lure which includes the following Rich Interactive Components (RIC):

LureBar allows users to select a webpage with Genie effect, to preview the selected webpage in a thumbnail, and to navigate to the selected webpage as shown below.

LureDoc allows users to navigate, browse, search, and annotate through a document which could

be a brochure, a catalogue, a paper, a report, an article, a manual, a book, a slide presentation, or a photo album in many different ways including flipping, sliding, panning, or scrolling. It also allows users to refer, rate, review, share, tag, bookmark, favorite, embed, and download a document.

LureList allows users to manipulate a list of items by selecting a particular view of the list, sorting

the list in ascending or descending order, define the columns to be sorted on, arrange the order of columns, and drill down on a particular item in a list.

LureMap allows users to navigate through the website by choosing different navigation paradigms

such as the accordion, drop down menus, tree, or thumbnails. In addition to some very useful shortcuts, LureMap offers some suggestions for webpages to visit such as similar webpages, top rated webpages, and recommended webpages.

LureMedia allows user to view a video or a slide presentation. It also allows users to refer, rate,

review, share, tag, bookmark, favorite, embed, and download the content. LureSurf allows users to navigate through a document with multiple webpages.

Luristic is particularly apt at turning the complex simple, and the simple powerful. We get motivated by demanding customers who want it all – from functionality to efficiency, from reliability to scalability, from flexibility to security, from usability to beauty, from function to form, from art to science, from intuition to analytics, from quantitative to qualitative, and everything in between.

22

Page 23: The Architecture Of Future Websites by Luristic

9. References The Next Generation Website Model, by Jerry Bader, October 13, 2006. The Future of the Web: Where Will We Be in Five Years?, by Cameron Chapman, November 3rd, 2009, noupe. HTML 5 and the Future of the Web, by Tim Wright, July 16th, 2009, Smashing Magazine. The Future of the Web is Semantic, by Naveen Balani, October 18th, 2005, IBM. The Future of the Web as Seen by Its Creator, by Peter Moon, July 9th, 2007, IT World.

23

Page 24: The Architecture Of Future Websites by Luristic

www.Luristic.com 1036 Quail Ridge [email protected] Irvine, California [email protected] 92603 [email protected] Tel: (949) 678-9930

© 2010 Luristic Corporation