Day 1 of ArabNet 2014: Entrepreneurial Ecosystems, Arabic Typography, Development Tools, and Psychological Web Design

As we are approaching this year’s ArabNet Digital Summit in Dubai, I thought I should share what happened at the latest ArabNet session, which took place in Beirut.

ArabNet is the one of the most important events in the region for digital creative professionals. The conference features workshops, talks, interviews, and panels on the latest topics in the Web industry, from coding to elements of design.

I have said and tweeted this many times, but I believe that ArabNet is the only conference in the Arab world that is truly worthwhile for developers, investors, and entrepreneurs in the fields of mobile, Web, e-commerce, and content to attend. And I say this having attended most of the others.

Yet, at ArabNet Beirut this year, I hardly saw any participants from GCC countries. It was just the CEO of GlueTube, based in Jeddah, and myself. At previous ArabNet conferences, there were many people from GCC countries participating as entrepreneurs, developers, sponsors, and even speakers. Some said this absence was caused by the political unrest in Lebanon, while others said it was because ArabNet Riyadh and the ArabNet Digital Summit in Dubai soaked up the GCC audience.

No matter what the reason, ArabNet Beirut produced interesting insights that I hope I can bring back to Saudi Arabia through a series of related articles over the next month.

Although the first of day of ArabNet 2014 was filled with talks, workshops, and a few breaks from 8 a.m. straight through 4:30 p.m., this article will focus on the events from the first day that were most memorable to me.

“Lightning Talks” Sessions

The “Lightning Talks” event was among the most information-packed of the first day. Each featured a very short presentation by an expert focused on a specific topic.

Psychological Elements of Web Design

In the first lightning talk, a designer named Myrrha discussed the psychological elements of Web design.

Her recommendations for Web designers were:

• Limit choices and calls to action to keep the user motivated to act.
• Emphasize headlines and captions, which allow the user to consume information quickly and easily.
• Focus on design and text decisions that inspire trust in order to ease the user’s fears.
• Ensure the user can see progress toward their goal, such as where they are in the checkout process.

Myrrha closed by saying that small details make a big difference to site users.

GreenSock Animation Platform vs. CSS Animations

In the second lightning talk, a developer named Simon discussed the following benefits of using the free, open-source GreenSock Animation Platform (GSAP), a platform based on Javascript, instead of the trendier CSS animations for browser animations:

1. Independent manipulation: Unlike CSS animation, GSAP allows for independent scale, rotation, and position control.
2. Hardware acceleration: Both CSS and GSAP can escalate processes to the GPU in order to go faster.
3. Control in general: GSAP allows animations to easily be reversed, restarted, forwarded, sped up, and slowed down, also unlike CSS keyframe animation.
4. Workflow: GSAP allows you to nest animations inside of other animations, utilize callbacks, and know when an animation starts, updates, completes, and repeats, while CSS3 does not.
5. Compatibility: CSS3 animations aren’t compatible with Internet Explorer without special tweaks, but GSAP is natively compatible with IE.
6. Effects: Unlike with GSAP, CSS3 limits you to physics-based motion. You can’t animate along a curve, animate the scroll position, or utilize animation attributes with CSS3, but you can with GSAP.

Finally, Simon encouraged audience members to always test technologies themselves to find a good fit for each project.

Back-End Scaling on a Budget

In the third lightning talk, a business founder named Joubran recommended the following strategies for back-end scaling:

1. Choose a scalable Web server, such as Nginx, that can handle numerous concurrent users.
2. Use a reverse cache proxy, such as Varnish or Nginx, to serve a cache version of each requested page to the user, which allows delivery to occur up to 1,000 times faster.
3. Use a queuing service, such as Gearman or RAS, to queue jobs that could cause a delay for the site user, such as sending the user an e-mail through a third-party API service.

According to Joubran, these solutions are all compatible with a limited budget.

Advantages of Django

The final lightning talk was presented by a developer named Eyad and covered the following advantages of the Django web framework:

1. Since Django is written in the programming language Python, which emphasizes readability, it is easy for both new and experienced programmers to work with.
2. As it is open-source, Django has an active community behind it.
3. Django comes with all of the expected components of a modern web framework, such as templates, user creation, sessions, etc.
4. This framework is easy to personalize: you can extend what you like and ignore or replace what you don’t.
5. Many helpful third-party apps exist to extend Django, facilitating tasks such as API creation.

Eyad closed by emphasizing that organizations from Instagram to Mozilla to ArabNet have successfully used Django. He advised the audience to visit, or, for third parties,

Panel Discussion on Entrepreneurial Ecosystems

Another memorable event on ArabNet’s opening day was a panel-based discussion that led to such a rich dialogue on promoting entrepreneurial ecosystems that I plan to dedicate a separate blog post to it.

Here are some of the points that came up most often during this discussion:

1. The need for regulatory development in the MENA region.

Many panelists said that the region’s underdeveloped regulatory system was a major barrier to progress.

Necessary changes brought up by panelists included:

• Simplifying and speeding up the process of starting a business
• Simplifying and speeding up the process of getting work visas
• Enabling different stock options, such as preferred shares
• Protecting board members from facing imprisonment if the company founder messes up.

2. The ethics of foreign venture-builders, such as Rocket Internet, that fund copycat start-ups.

This discussion focused on foreign venture-building organizations that take business models popular in regions with well-developed business environments and fund the creation of copycats in the MENA region, typically by training and launching entrepreneurs under stressful conditions. Rocket Internet was the major example.

The more optimistic side of this argument discussed the benefit that these organizations provide to the region by training locals, some of whom become successful within the companies that are funded and others which filter into the job market with profitable skills.

Arguments against these organizations focused on their lack of originality, high-pressure training, focus on statistical success rather than emphasis on helping individual entrepreneurs succeed, and lack of patience and familiarity with the region.

3. The lack of profitable exit strategies in the region.

Several panelists agreed that few entrepreneurs cash out successfully in the MENA region.

The following were cited as areas of the business environment that need to develop in order to facilitate exit strategies:

• Merger and acquisition market within the region
• True market for ideas
• More companies that are dominant in their niche
• More companies that define their customer base and exit plan from the start
• More companies that appeal to existing big players’ pain points, growth plans, and/or interests
• More companies willing to invest in growing themselves past the $30 million mark

4. How to improve accelerators.

Toward the end of the session, the Deputy Director of a relatively new accelerator asked for advice on what regional accelerators should do next.

Panelists advised accelerators to focus on the following areas:

• Training people
• Bringing in people who can scale a business
• Providing accurate metrics to participants and investors
• Providing access to an excellent mentor network of entrepreneurs and angel investors

The session closed with panelists expressing excitement about improvements in the region, especially growth coming from the spread of knowledge and information, improved access to funding, and technological progress.

Arabic Typography on the Web and Mobile Apps

Finally, a workshop titled Typography in Web & Mobile was memorable to me, perhaps because one of the apps I co-founded, ShopMate, was publicly reviewed there! It was hosted by Huda Smitshuijzen AbiFarès, Founding Creative Director of the Khatt Foundation, and Fawzi Rahal (@fawzirahal), Founder and Managing Partner at gamutt.

The workshop covered the following topics:

1. Improving legibility for screen-based Arabic type.

• What people read best is what they are used to reading, so change to type should be incremental
• Unlike with books, screen-based type must be designed for fast reading on small surfaces (laptop, iPad, etc.
• As with road signs, type that is too light or thin will seem to fade
• Type should also not be exaggeratedly bold, as that will make letters seem to close up, becoming less distinguishable
• Type should not have unnecessary, calligraphic, or ornamental details
• Type should be horizontally and vertically compact (e.g. ascenders and descenders as short as possible, no long kashidas, etc.)
• Type strokes should have fairly even thickness

2. Using type to organize information.

• Mixing type styles can help create hierarchy, but care must be taken to do so in a logical way (one font for headlines, another for body text, etc.)
• Mixing font weights and sizes can also organize information
• Using color for headlines is another classic organizational strategy

3. Appropriate use of color in typography.

• Typeface should always contrast with background (e.g. dark font, light background)
• Light or white font or a dark or black background appears bolder, so a thinner font should be used
• Dark or black font on a light or white background appears lighter, so a thicker font should be used
• Color can be used to create mood and send signals (pink for femininity, blue for masculinity, or a mix of primarily colors for child-friendliness, yet care must be taken to make sure these stereotypical colors actually appeal to the target market)
• Less is more; overuse of color distracts from content
• Avoid using complementary colors (i.e. colors directly across from each other on the color wheel)

4. Wireframing basics.

• Wireframing is a pre-design, pre-workshop step that involves creating a simple skeleton of what your app, website, or content will look like
• The purpose of wireframing as a first step is to isolate design and focus on creating a logical structure
Balsamiq is one of many UI wireframe apps; its childlike sketches help isolate design
MediaLoot is a membership-based website that offers flat UI kits in the form of Photoshop files
PowerPoint templates have also been designed for wireframing

Huda and Fawzi then reviewed apps suggested by participants. The creator of a newer app was the first volunteer. They advised him to improve his logo’s readability by making it bolder and simpler, as well as decreasing stroke modulation. They also suggested replacing the white-on-black color scheme with black writing on a lighter color, both for the logo and app text. General usability advice focused on reducing the amount of information presented to the viewer at a time, replacing the complicated icons with simple dots, better separating images from text, using color to create hierarchy, and replacing the standard Apple Maps with more accurate maps.

Next up was me, presenting with the app I co-founded, ShopMate. Huda described it as “useful” and “kind of cute,” with “not too much gimmick.” Fawzi said it had an “Instagram-ish approach.” ShopMate was praised for being simple, colorful, and straightforward to use.

Then Huda and Fawzi encouraged each participant in the audience to pick one app to analyze, play with it on their phone, and write down which features could be improved. Then, participants worked on using wireframing to create a better version.

As you can see, ArabNet delivered on its promise to cover the most pressing topics in the Web industry from day one. Whether the task at hand is writing code or designing type, most digital creatives wear many hats, and ArabNet knows how to cater to that innovative mindset.

If you enjoyed this article, stay tuned for more inside glances into the top event for digital creative professionals, and check out @ArabNetME on Twitter. Finally, please consider registering for the ArabNet Digital Summit in Dubai this June. There is a discount for attendees under 30 and an even better discount for attendees under 22.

Tagged , , , , , , , , , , , , , , , , ,

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: