Sunday 31 January 2016

TryDesign - PhotoGrid

Tonight I would like to redefine an app called Photo Grid, it's a universal app that works on iPhone as well on iPad. But, I would like to optimize the app for iPad because, it seems not use the flexibility of multi-orientation on iPad that should be utilize.

Lets started with the app icon.

Almost the same. Easily replicable with Sketch. The base green, red, blue, yellow as similar to Google, Microsoft logo color pellete.

The process of making gear icon:

Rectangle > Transform > Rotate Copies > Oval > Union > More oval > Subtract. For this theme, we remove the fill, and change the outline to white.

Here is the main layout. What I want to see is the app support horizontal layout. (Left the original -> my redesign on Sketch). The gradients color box below represent the poster, that should be replaced with some inspirational photo that can be made with this app.

First Iteration

Second Iteration: Main Page

Add Some Pics to Edit

Editing mode

So the editing mode, technically with this depth of editing. It's not easy to develop right. And the canvas having the image. Resizable etc. 

It's a long time persue. 

Saturday 30 January 2016

Seminar My Documents - Urus Bisnes Gaya Korporat

Pada tanggal 30 Januari 2016, saya telah menghadiri program Seminar My Documents dengan tagline 'Urus bisnes gaya korporat' yang di kendalikan oleh Tuan Abdul Basit. Secara ringkat berikut adalah antara perkara-perkara yang dipelajari sepanjang program yang berdurasi 5 jam.

• Video intro (tengok telefon anda) countdown dan sedikit warming up.

3 Perkara Pokok yang akan dipelajari:

1. Kenapa seseorang owner bisnes susah nak kembangkan bisnesnya.
2. Bagaimana bisnes boleh diperkembangkan dengan roda bisnes.
3. Bagaimana urus bisnes dengan file system.

"Jangan berkira-kira dengan ilmu" 
Ketika kita rasa kita dah tahu banyak perkara, kita sudah mendekati kegagalan. "Aku dah tau!.." 
Peten orang yang berjaya adalah: "mereka tak berhenti belajar dan suka kepada majlis ilmu.
"Jika ada masalah, back to your parents"

4 Jenis Guru-guru yang Penting

1. Guru Motivasi & Keberanian.
- siapa guru yang boleh marah anda.
- manusia ibarat seperti handphone dimana perlu sentiasa dicas.

2. Guru Teknikal & Operasi
- guru dalam industri anda
- beliau telah terbukti dalam bidangnya

3. Guru Pengurusan & Sistem
- pakar dalam pengurusan bisnes, agreement, file dan sebagainya

4. Guru Agama & Kerohanian
- segala usaha yang dilakukan hasilnya hanya dengan izin Allah
- guru yang memperbaiki keagamaan dan kerohanian

"bila kita berhenti belajar, kejayaan berhenti mencari kita"
"Dalam bisnes, tidak penting siapa yang mulakan, tapi siapa bersama kita jauh lebih penting" 

Mentaliti Bisnes

1. Pengusaha
- 'cakap pandai, buat belum tentu'
- idea generator

2. Pengurus
- kuat membebel
- orang buat sistem
- suka marah-marah

3. Pembuat
- sangat berkira-kira
- susah nak percayakan orang
- pantang dicabar
- semua benda dia nak buat
- pantang nampak duit
- kebanyakan orang bermula dari mentaliti ini
- dan susahkan orang itu untuk tinggalkan bisnes beliau.

6 Roda Pengurusan 

Perihal Documents

Dokument adalah apa sahaja yang berbentuk rekod. Ia adalah rahsia samaada bisnes anda bernilai tinggi atau tidak.

Cuba tengok resit, ia tidak sepatutnya dibiarkan terperap dalam dompet anda. Sila fotostat dan masukan dalam file yang sepatutnya. Resit tidak semestinya disimpan dalam satu file sahaja.

TIPS: 1 file dibuka dengan satu tujuan.

"Bisnes bukan main-main, kalau main-main jangan bisnes".
"orang pandai cari ilmu untuk bekerja, orang berjaya cari orang pandai untuk bekerja dengannya"

Formula Urus File : 3M

M: Merekod 
- segala jenis rekod yang ada.
- mendokumentasikan apa sahaja (SOP, surat perlantikan dan sebagainya.)

M: Mengelas
- kelaskan mengikut 6 jenis pengurusan mengikut 6 roda di atas.

M: Menyusun
- boleh gunakan warna untuk mewakili jenis.
- boleh letak nombor dan kod.


Ada beberapa perkara lagi tentang perihal isi dokumen seperti agreements, timeline progress, job description, document admin, HR, claim dan pelbagai perihal isi dokumen yang biasa orang bisnes tahu.

Extra: ESBI (Formula Rober Kiyosaki). VMO (Vision, Mission, Objective) akan dikupas pada next post.

Sekian sahaja post tentang My Documents ini, saya telah tahu tentang seminar ini beberapa bulan lepas, dan memang sedikit sebanyak memberi input berguna bagaimana nak uruskan bisnes secara lebih sistematik.


Nak belanja gambar sikit.

Friday 29 January 2016

DevTime - Auto Layout + Class Sizes

By using auto layout with the standard size class (any width and any height) with proper constrains will make wonderful things.

From this:
To a proper clock. 

TryDesign - Tour Page

Tour page is a quick introduction for an app. It might have 2-5 slides. So let me introduce the upcoming update for FaceClock 2. We just want to add more spice to the app with adding some welcome slides. Here are what looks like:

Simple. Yet quick enough to say welcome to first time user.

TryDesign - Red Clock Settings

Hey, this is yet another post on designing with Sketch app. As you may know Sketch app is an exclusive app for Mac for designing production user interface element. I used to use Adobe Illustrator, but the tool is much more suitable for vector illustration, games and so on. For user interface, apps UI, web UI, and other apps related design this Sketch app tool is highly recommended.

Sketch app actually looks pretty simple but quite powerful, as almost capable to do what ever it takes to design something wonderful, modern and stylish. Yes, lets go on for this post with yet anohter app that I try to redesign using Sketch. I try to sketch my skill on using this tool which is pretty new for me. So probably by doing this hand excercise, I would expand my skill and tricks with Sketch

This app is kindof a competitor to FaceClock by the way. Lets learn something from them.

* To see the amount of work that need to be done.*

Segmented Control

I use the provided control from Sketch template, however it is only have 3 elements, but we need 5, so here the technique I use.

Some good reference :

Tuesday 26 January 2016

TryDesign - App Icon for Relax Melodies

I feel relaxed when listening to Celtic Ride on Relax Melodies app. The music touches the soul of people :).

So today, I would like to (hopefully can touch) try design the icon for relax melodies. The challenge for the app icon is, the icon is a great realistic illustration. As 'programmer artist' probably a little bit, felt challenged to do that, if I want to be full blown artist, I need to have the Wacom. Anyway I just use my trackpad on MacBook Air.

You know, I don't want to make excuses, ehem, try try at my level best, ok. So, the most left icon is the original icon. It has music water drop. Oh, my, very detail right?

Hmm. So the leaf, form a new logo, kind of cool. By the way, by removing some leaves we got something freshier like the below. 

Wasn't that more refreshing. Yaww!

Update on 27 Jan. I added the remordenizing the UI for the app main page. Looks more refreshed.

If you have problem to sleep, like I do, go to

Saturday 23 January 2016

TryDesign - Yahoo Developer Page

As usual, lets try design. This time is the Yahoo! mobile developer suite web page. What catch my eyes is the hero part, it's brilliant purple abstract. 

Here is my design export.

Designing needs more practice. So this is my practice on Sketch. Thank you.

* I got my Logitech Performance MX for mousing pleasure. For my work too. *

TryDesign - Non-TableViewSettings Page

Many apps out there using table view for settings including us. For many of our apps like FaceClock series and new one Presentation Timer, using table view is no brainer. It's simple, flexible and multi purpose. But today I would like to try designing a non-table view layout as settings page (should I call it page for app?). Here is settings from app called Wake by TinyHands.

* The setup is using Sketch app, designing at 2x resolution. *

Lets try design the speaker. It's easy for the core part, but hard for the wave. So at first try I use 45degree square then cut it out how ever the result is looked distorted. 

Next, I try with oval shape. Then, cutted it until become the nicer wave.

Well, that is the wrap. Not all icon I tried to redesign, some elements like battery, iPhone and shop. Others are from another library. Some of them are by Code+Design website, check it out it pretty awesome.

Tuesday 19 January 2016

Berapa Banyak Tidur Yang Saya Perlukan?

#Kitaran-tidur #kurangTidur #macamManaNakTidurDenganBaik

Bila masa anda terkejar-kejar dengan masa untuk memenuhi tugasan seharian, macam mengurangkan waktu tidur adalah jawabannya sahaja. Siapa yang mampu memenuhi masa untuk tidur? Sebenarnya anda tak patut untuk tidak tidur. Malahan kalau kurang tidur akan menyebabkan anda kurang mood, tenaga dan kemampuan untuk menangani tekanan. Dengan memahami keperluan untuk tidur malam, dan tahu bagaimana untuk menangani dari kekurangan tidur yang teruk, anda boleh mendapatkan kitaran tidur yang sihat pada akhirnya.

Kepentingan Tidur

Ramai antara kita cuba untuk tidur sedikit yang mungkin. Banyak benda di luar sana yang boleh menarik perhatian dari pada untuk tidur lebih masa, sepertimana keperluan bersenam dan makanan yang seimbang, begitu juga dengan tidur. Kualiti tidur secara langsung berkaitan dengan kualiti masa berjaga, termasuk ketajaman mental, produktiviti, keseimbangan emosi, kreativiti, daya hidup fizikal, dan juga termasuk dengan berat badan. Tiada aktiviti lain yang boleh beri pelbagai kebaikan dengan sedikit usaha!

Memahami Tidur

Waktu tidur adalah bukan masa di mana badan dan minda behenti berfungsi. Semasa anda berehat, minda masih sibuk, menyelia pelbagai aktiviti biologi untuk mengekalkan badan anda dalam kondisi yang terbaik, dan menyediakan untuk hari mendatang. Tanpa waktu tidur yang cukup untuk tidur pemulihan, anda tidak dapat bekerja, belajar, mereka, dan berkomunikasi pada tahap yang anda sepatutnya boleh capai. Selalu mengurangkan "servis" tersebut anda akan menuju kepada kerosakan mental dan fizikal yang teruk.

Berita baik, anda tak perlu untuk memilih antara produktiviti dan kesihatan. Bila anda mula mendapakatkan waktu tidur yang anda perlukan, tenaga dan efisiensi anda juga akan meningkat. Malahan, anda akan dapati lebih banyak kerja yang boleh diselesaikan pada waktusiang dari pada mengurangkan tidur anda.

Berapa Jam Tidur yang Saya Perlukan?

Menurut Institut Kesihatan Kebangsaan, purata dewasa tidur adalah kurang dari 7 jam semalaman. Dalam zaman serba pantas ini, 6-7 jam tidur dengar macam bagus. Secara realiti, ia adalah resipi untuk kekurangan tidur yang kronik.

Dia ada perbezaan yang besar di antara jumlah tidur yang anda boleh dapat dan juga jumlah yang diperlukan untuk berfungsi secara optimum. Dengan hanya kerana anda boleh beroperasi dengan 7 jam tidur tidak bermakna anda akan tidak berasa lebih hebat dengan meluangkan lebih masa dalam 1 ke 2 jam pada katil


Tahap-tahap Tidur : Tidur REM dan tidur bukan-REM.

- tidur bukan-REM: 3 tahap tidur.
- tidur REM (Rapid eye movement)  bila anda dalam mimpi yang aktif. Mata anda sebenarnya bergerak ke hadapan dan kebelakang pada fasa ini, sebab itu dipanggil Rapid eye movement.



Monday 18 January 2016

Time is Money

Time is money. Well, how true is that? Do you think by idly spending, laughting, crying or anything in between can create income? Let examinate.

Adam's Formula
Income = Value × Time

'You must spend more of your time only on activities that create the greatest value... that generate the most profits for your company,' Adam said.

Whether you are an entrepreneur or an employee, you will have a list of things that you must do everyday as part of your responsibility. You will find that not all the things you do, create the same amount of value. There are some activities that create high value while some activities are low in value.

"In fact, I have discovered that most average income earners spend only about 20% of their workday doing truly high value added activities while they spend most of their time, about 80%, on low value activities like checking email, browsing website, reading Facebook newsfeed, attending unproductive meetings, chit chatting, complaining, waiting, finding lost items... stuff that does not generate profits or help clients meet their goals, " Adam added.

"High-income earners are the opposite. They tend to spend 80% of their time on high value added activities like business development, closing sales, innovating new revenue streams, market strategizing, following up with prospects, strategizing on how to improve productivity, managing projects, getting feedback from clients... stuff that lead to high customer satisfaction and higher profits!," Adam explained.

How to Spend 70% of Your Time On High Value Activities... then 100%

You may be wondering to yourself, how I'm just an employee who being delegated to do some sort of stuff.

Start focusing on doing all the high value activities first. Spend at least 70% of your total workday on these activities. Then, use non-work hours to clear most of the 30% low value stuff! Thehours of 9 am - 6 pm are the critical times when your actions must be generating high profits, like developing new businesses, following up with clients, ensuring product quality, strategizing growth in meetings and so on. Doing paperwork, organizing your files, surfing to research materials and checking emails should be done after office hours.

Once you have managed to fully optimize your time, you must then take the next step. You must ask for an assistant so you can delegate all your low value activities to this person and fully concentrate your time on high value activities. Remember, if you do not already have an assistant or one is not provided for you, be proactive!

How Do You Use Your Time Now?

Now that you know the value of time and how to increase time spent on creating high value activities to maximize your total worth and ultimately your income.

Some exercises to do, pick a typical work day in your life. For each of the time periods, fill in the typical activity you would be doing. In the las column, indicate on a scale of 1 (lowest) to 5 (highest), the amount of value that activity creates. This is obviously very subjective so it depends on your judgement. Again, remember that an activity is high in value if it directly or indirectly results in customer satisfaction and /or higher profits.

Now, in the second exercise, I want you to list down all the activities that you must do in your job, what percentage of time you spend on each activity and again, the level of value creation. 

So, what did you discover about yourself through this activity? Are you spending your time optimally? Or is there a lot of unproductive time spent everyday? Is there a lot of room for you to spend more time on activities that will increase your value and income?

Think! How can you massively increase your total worth by focusing on the activity that creates the most value to your employer or business.

"Now, I want you to re-plan the use of your time. Re-plan your daily activities so it will maximize your time value. Take at least twenty minutes to do the next two exercises."

"On the 2nd exercise, I want you to list down all the activites that you must do in your job, what percentage of your time do you intend to spend on each activity and again, the level of value creation. And, more importantly, which activites do you want to delegate to other people eventually?"

What are the activities that you can delegate right now?

What ar ethe activities you will plan to delegate in the near future? What is the deadline for this?

※ Please email/whatsapp your email to get the Number or Excel spreadsheet to or +6016-337-3081. ※ 

excerpt fro book written by Adam Khoo

Sunday 17 January 2016

TryDesign - WordBrain

Today TryDesign challenge is to rebrand, redesign the word game called wordbrain. The challenge is simple, design it equal or better. I made it with Mac app Sketch.

Here we go with the result.

App Logo:

WordBrain with the brain, but I don't have so much time to scribble brain or find actual brain illustration resources. I change the metaphora to something like visualization image. There we go, the quare stacked each others with some opacity. And the name became WordGame.

The level picker. Use the wordgame. See the padlock.

Game Scene. Almost the same. Human pictogram. '?' Should be bigger. Numberic character space should be nearer. 

Anyway, that is the wrap. I don't plan to develop this kind of game, but have roughly though how the game was made. The hard part probably to make a word like 'Goat' to be split into array datatype which can satisfy some of the conditions. And the pattern to the tiles selectable has about 12 ways for 2x2. I don't know how much for 3x3 and more. 

And another interesting thing about the game is you can create a word and challenge your friend with ID. I think that is the way developer create the puzzle word. Use the app as tool to create to puzzle. Genius.

Last thing. The app icon.

Saturday 16 January 2016

Steve Jobs Movie 2015

I've been reading, listening (audiobooks) and observing human named Steve Jobs. Previously Steve Jobs was appear as himself in movies. The classic one 'Pirate of Silicon Valley' and after that it was movie named 'Jobs' played by Ashton Kutcher, in 2013. Last year there is a new Steve Jobs movie directed by Aaron Sorkin. It based from the book written by Walter Isaacson.

The movie Steve Jobs 2015 is moved around 3 Apple product launches. It has a lot of things happen before, and after the 'Keynote'. Related stories are shown as flashback.

1. Original Macintosh's Launch. (the product failed commercially)
2. NeXT's Launch. (the product failed commercially)
3. iMac's Launch. (the product succeed commercially)


There are something new that I discovered.

1. Steve Woz wanted too badly for Steve Jobs to talked about Apple II. Woz also and Jobs fought at iMac launch. Who knows right? Woz wanted Jobs to acknowledge the Apple II.

Woz made the Apple II with open system. Steve Jobs don't want make the computer to be a geeky. He wanted to make it as utilities. You know by have this vision, he wanted any, average people on the world use the computer use it like a television, or toaster. It has bigger market than, making the computer for hobbyist or hardware junkie. It was against what Steve Wozniak thought about.

Woz was not satisfied with Steve Jobs. Woz was the man that doing the engineering genius. But on the media people said Steve Jobs is a genius even though in reality Steve Jobs didn't know how to code, how to engineer. "What do you do?" Woz asked. "I play the orchestra and you play greatly as instrument player".

2. Andy Hertzfield has relationship with Steve Jobs's ex-girlfriend Brennan. Andy took care about Lisa.


What good about Steve Jobs:

1. Visionary 

That is the core of Steve. Because of his vision, he get up and wanted to create personal computer, computer for the rest of us.

At early time,

2. Practically Perfectionist (Be better than anything you have seen)

In business and marketing perspective, unique selling proposition (USP) is extremely crucial to make it successful. Steve Jobs rethought everything.

3. Intuition

Understand human. Pretty much Steve Jobs knew what human want, what human desired. What human need to be empowerd. And he knew human loves simplicity, and that is what Steve Jobs did.

4. Emotional Drive

Emotional drive on making a product or marketing campaign.

Steve Jobs keep the drawing of Lisa made on original Mac.

5. Ruthlessly Working and a Pusher

He don't take easy on his job. He is really serious.

Steve also know how to push his employee to follow what his vision.

6. Egoistic

Ego is good if in control, to make great product. But having too much will make you seems like an ass-hole, especially when dealing with people.

7. Leadership

Crediting his people on their jobs.

8. Catchy

'A diskette on pocket of shirt'. 'MacBook Air inside the evelope'. 'Thinnest smartphone in the World". "iPod fit in your jeans pocket".

In term of marketing, it make people gonna to remember that catchiness, the cool factor of the device.


What bad about Steve Jobs

On the other side, Steve Jobs had family problem with his previous relationship and his daughter Lisa. It was hurtening to see that, but it what he made mistake. He was kind of asshole when he didn't care much about his previous girlfriend and his daughter.

However Steve seemed to recover the problem time after time.


What to take from the movie:

- Having a product launch event is crucial for big company. Other way around is use other conventions. The 'Keynote' presentation. It's crucial to get people see your presentation, get known, get excited and get to be loved (if possible).

- iReka Soft has experience in participating in event as exhibitor. But, we will have an event to introduce our products. By watching the movie I agree, the product launch can be very important to let.

- On Event Part, we can relate with program / presentation done by Dr Azizan and Richworks team. They made a very high-energy aura among the participant.

- Steve Jobs took care about the 'keynote' very seriously. He rehearsal the keynote to the employee, and the employee participate and give good feedback to him. The employees were so supportive.

- Steve Jobs is marketing genius. He was also a genius leader that can gather genius enabler (engineers, designers, operation, HR and many more). His rules was hire A people. A people attracts A people.

- Steve Jobs create product that he was also wanted. Not because just market potential.


If you make presentation, take care of your time, use this app to help.

Friday 15 January 2016

iOS Gradient Color

So do you think choosing color is easy. It's easy to pick a bad color, especially when using gradient. Sometime we don't have that great sense of what kind of combination that make great gradient.

You may get some help from this website :

Apple Hardware Design Workspace

Sir Johny Ive designing Apple Watch

Design Office Workspaces

iPhone 6 - Emotional connection with the object. Only know by have the models.